补充代码

front-end/mall4uni/.editorconfig

@@ -0,0 +1,8 @@
+root = true
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true

front-end/mall4uni/.env.development

@@ -0,0 +1,16 @@
+# 如需添加更多环境变量，请以 VITE_APP_ 开头声明
+# 在代码中使用 import.meta.env.VITE_APP_XXX 获取指定变量
+
+# 环境配置标识
+VITE_APP_ENV = 'development'
+
+# 微信公众号appid
+# 注意此处为微信 公众号appid，不是小程序appid
+# 小程序appid在 manifest.json 文件的 mp-weixin.appid 字段中配置
+VITE_APP_MP_APPID = 'wx42bbe857570c5b40'
+
+# 统一接口域名
+VITE_APP_BASE_API = 'http://127.0.0.1:8086'
+
+# 图片域名
+VITE_APP_RESOURCES_URL = 'https://img.mall4j.com/'

front-end/mall4uni/.env.production

@@ -0,0 +1,16 @@
+# 如需添加更多环境变量，请以 VITE_APP_ 开头声明
+# 在代码中使用 import.meta.env.VITE_APP_XXX 获取指定变量
+
+# 环境配置标识
+VITE_APP_ENV = 'production'
+
+# 微信公众号appid
+# 注意此处为微信 公众号appid，不是小程序appid
+# 小程序appid在 manifest.json 文件的 mp-weixin.appid 字段中配置
+VITE_APP_MP_APPID = 'wx42bbe857570c5b40'
+
+# 统一接口域名
+VITE_APP_BASE_API = 'http://127.0.0.1:8086'
+
+# 图片域名
+VITE_APP_RESOURCES_URL = 'https://img.mall4j.com/'

front-end/mall4uni/.env.testing

@@ -0,0 +1,16 @@
+# 如需添加更多环境变量，请以 VITE_APP_ 开头声明
+# 在代码中使用 import.meta.env.VITE_APP_XXX 获取指定变量
+
+# 环境配置标识
+VITE_APP_ENV = 'testing'
+
+# 微信公众号appid
+# 注意此处为微信 公众号appid，不是小程序appid
+# 小程序appid在 manifest.json 文件的 mp-weixin.appid 字段中配置
+VITE_APP_MP_APPID = 'wx42bbe857570c5b40'
+
+# 统一接口域名
+VITE_APP_BASE_API = 'http://127.0.0.1:8086'
+
+# 图片域名
+VITE_APP_RESOURCES_URL = 'https://img.mall4j.com/'

front-end/mall4uni/.eslintignore

@@ -0,0 +1,17 @@
+# eslint 忽略列表
+
+# disk编译目录
+dist
+
+build/*.js
+src/assets
+src/components/tki-barcode
+src/package-user/components/uv-parse
+src/uni_modules
+src/utils/jwx
+src/js_sdk
+public
+
+uni_modules
+auto-imports.d.ts
+

front-end/mall4uni/.eslintrc.cjs

@@ -0,0 +1,87 @@
+
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+    node: true
+  },
+  globals: {
+    uni: 'readonly',
+    getApp: 'readonly',
+    wx: 'readonly',
+    getCurrentPages: 'readonly',
+    plus: 'readonly'
+  },
+  extends: [
+    'standard',
+    './.eslintrc-auto-import.json',
+    'plugin:vue/vue3-recommended',
+    'plugin:vue-scoped-css/vue3-recommended'
+  ],
+  overrides: [
+  ],
+  parserOptions: {
+    ecmaVersion: 'latest',
+    sourceType: 'module'
+  },
+  plugins: [
+    'vue'
+  ],
+  rules: {
+    // Possible Errors
+    // 要求使用 let 或 const 而不是 var
+    'no-var': 'error',
+    // 强制 "for" 循环中更新子句的计数器朝着正确的方向移动
+    'for-direction': 'error',
+    // 强制 getter 函数中出现 return 语句
+    'getter-return': 'error',
+    // 禁止在嵌套的块中出现变量声明或 function 声明
+    'no-inner-declarations': 'error',
+    // 禁止由于 await 或 yield的使用而可能导致出现竞态条件的赋值
+    'require-atomic-updates': 'error',
+    // console 警告
+    'no-console': 'warn',
+    // 禁止出现未使用过的变量
+    'no-unused-vars': [
+      'warn',
+      {
+        args: 'all',
+        caughtErrors: 'none',
+        ignoreRestSiblings: true,
+        vars: 'all'
+      }
+    ],
+    // 关闭名称校验
+    'vue/multi-word-component-names': 'off',
+    // 非生产环境启用 debugger
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+
+    // Best Practices
+    eqeqeq: 'off',
+
+    // Stylistic Issues
+    // 强制可嵌套的块的最大深度
+    'max-depth': ['error', 5],
+    // 强制函数最大代码行数
+    'max-lines-per-function': [
+      'error',
+      {
+        max: 150,
+        skipBlankLines: true
+      }
+    ],
+    // 强制回调函数最大嵌套深度
+    'max-nested-callbacks': ['error', { max: 10 }],
+    // 强制函数定义中最多允许的参数数量
+    'max-params': ['error', { max: 5 }],
+    // 强制每一行中所允许的最大语句数量
+    'max-statements-per-line': ['error', { max: 1 }],
+    // 三目运算符换行
+    'multiline-ternary': ['error', 'never'],
+    // 传值给组件时的使用 kebab-case
+    'vue/v-on-event-hyphenation': ['warn', 'always', {
+      autofix: true,
+      ignore: []
+    }]
+  }
+}

front-end/mall4uni/.gitignore

@@ -0,0 +1,28 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+.DS_Store
+dist
+*.local
+
+# Editor directories and files
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+/src/auto-imports.d.ts
+
+.idea
+.hbuilderx
+.vscode
+package-lock.json
+pnpm-lock.yaml
+.eslintrc-auto-import.json

front-end/mall4uni/.npmrc

@@ -0,0 +1,4 @@
+engine-strict = true
+shamefully-hoist = true
+strict-peer-dependencies = false
+registry = https://registry.npmmirror.com

front-end/mall4uni/Dockerfile

@@ -0,0 +1,3 @@
+FROM nginx:1.20
+COPY ./dist/build/h5 /usr/share/nginx/html/h5
+COPY ./nginx.conf /etc/nginx/conf.d

front-end/mall4uni/LICENSE

@@ -0,0 +1,661 @@
+                    GNU AFFERO GENERAL PUBLIC LICENSE
+                       Version 3, 19 November 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <http://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 <http://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
+<http://www.gnu.org/licenses/>.

front-end/mall4uni/README.md

@@ -0,0 +1,99 @@
+![输入图片说明](https://images.gitee.com/uploads/images/2019/0711/174845_6db7724e_5094767.png "在这里输入图片标题")
+
+
+一个基于springboot的开源商城 uniapp端
+
+Mall4j商城系统uniapp版本，做啥都不愁。即使不跨端，uni-app也是更好的小程序开发框架、更好的App跨平台框架、更方便的H5开发框架。不管领导安排什么样的项目，你都可以快速交付，不需要转换开发思维、不需要更改开发习惯。
+
+
+该项目仅供学习参考、可供个人学习使用、如需商用联系作者进行授权，否则必将追究法律责任
+
+
+
+## 开发环境启动
+
+### 1.安装nodejs
+
+[NodeJS](https://nodejs.org/) 项目要求最低 18.12.0，推荐 20.9.0
+
+如果不了解怎么安装nodejs的，可以参考 [菜鸟教程的nodejs相关](https://www.runoob.com/nodejs/nodejs-install-setup.html)
+
+### 2.启动
+
+- 项目要求使用 [pnpm](https://www.pnpm.cn/) 包管理工具
+- 使用编辑器打开项目，在根目录执行以下命令安装依赖
+
+  ```
+  pnpm install
+  ```
+
+- 运行
+
+  ```
+  pnpm run dev:h5
+  ```
+
+- 部署
+
+  ```
+  pnpm run build:h5
+  ```
+
+- 如果不想使用 pnpm，请删除 `package.json` 文件中 `preinstall` 脚本后再进行安装
+
+  ```json
+  {
+      "scripts" : {
+          "preinstall": "npx only-allow pnpm"  // 使用其他包管理工具（npm、yarn、cnpm等）请删除此命令
+      }
+  }
+  ```
+
+
+## 项目链接
+
+java后台：https://gitee.com/gz-yami/mall4j
+
+vue后台：https://gitee.com/gz-yami/mall4v
+
+原生微信小程序：https://gitee.com/gz-yami/mall4m
+
+uniapp端：https://gitee.com/gz-yami/mall4uni
+
+
+## uni-app相关截图
+
+![un-app总截图](./static/screenshot/uniappInfo.png)
+
+![un-app首页截图](./static/screenshot/uniappIndex.png)
+
+![un-app购物车截图](./static/screenshot/uniappCart.png)
+
+![un-app个人中心截图](./static/screenshot/uniappMy.png)
+
+![un-app商品sku截图](./static/screenshot/uniappSku.png)
+
+
+
+## 小程序相关截图
+
+![小程序截图](https://images.gitee.com/uploads/images/2019/0706/085234_4eb7509b_5094767.jpeg "小程序截图")
+
+
+
+## 提交反馈
+- Mall4j商城官网 https://www.mall4j.com
+
+
+- Mall4j商城官方技术QQ 1群：722835385（3000人群已满）
+- Mall4j商城官方技术QQ 2群：729888395
+- 如需购买商城商业版源码，请联系商务微信
+
+  ![输入图片说明](https://19838323.s21i.faiusr.com/4/4/ABUIABAEGAAgksmNlAYojomK2gIwrAI4rAI!160x160.png)
+
+
+
+## mall4cloud微服务商城版本已上线
+https://gitee.com/gz-yami/mall4cloud
+
+## 更多信息请查看Mall4j商城官网 <https://www.mall4j.com>

front-end/mall4uni/index.html

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8" />
+  <meta name="renderer" content="webkit">
+  <title>mall4uni-pro</title>
+  <script>
+    let coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
+      CSS.supports('top: constant(a)'))
+    document.write(
+      '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
+      (coverSupport ? ', viewport-fit=cover' : '') + '" />')
+  </script>
+  <!--preload-links-->
+  <!--app-context-->
+</head>
+<body>
+<div id="app"><!--app-html--></div>
+<script type="module" src="/src/main.js"></script>
+</body>
+</html>

front-end/mall4uni/jsconfig.json

@@ -0,0 +1,10 @@
+{
+  "compilerOptions": {
+    "types": [
+      "@dcloudio/types",
+      "miniprogram-api-typings",
+      "mini-types"
+    ]
+  },
+  "allowJs": true // 允许编译js文件
+}

front-end/mall4uni/nginx.conf

@@ -0,0 +1,29 @@
+server {
+    listen 80;
+    server_name mini-h5.mall4j.com;
+
+    gzip on;
+    gzip_static on;
+
+    location / {
+        try_files $uri $uri/ /;
+        root /usr/share/nginx/html/h5;
+        index index.html;
+
+        #### kill cache
+        add_header Last-Modified $date_gmt;
+        add_header Cache-Control 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
+        if_modified_since off;
+        expires off;
+        etag off;
+    }
+
+    error_page 404 /404.html;
+        location = /404-light.html {
+    }
+
+    error_page 500 502 503 504 /50x.html;
+        location = /50x.html {
+    }
+}
+

front-end/mall4uni/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "mall4uni-pro",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "preinstall": "npx only-allow pnpm",
+    "dev:h5": "uni",
+    "dev:h5-test": "uni --mode testing",
+    "dev:mp-weixin": "uni -p mp-weixin",
+    "build:app-android": "uni build -p app-android",
+    "build:app-ios": "uni build -p app-ios",
+    "build:h5": "uni build",
+    "build:h5-test": "uni build --outDir=./dist/test/h5 --mode testing",
+    "build:mp-weixin": "uni build -p mp-weixin",
+    "lint": "eslint --ext .js,.vue src",
+    "lint:fix": "eslint --fix --ext .js --ext .jsx --ext .vue src",
+    "prepare": "husky install",
+    "lint:staged": "lint-staged"
+  },
+  "engines": {
+    "node": ">=16",
+    "pnpm": ">=6"
+  },
+  "dependencies": {
+    "@babel/eslint-parser": "^7.21.3",
+    "@dcloudio/uni-app": "3.0.0-3080720230703001",
+    "@dcloudio/uni-app-plus": "3.0.0-3080720230703001",
+    "@dcloudio/uni-components": "3.0.0-3080720230703001",
+    "@dcloudio/uni-h5": "3.0.0-3080720230703001",
+    "@dcloudio/uni-mp-alipay": "3.0.0-3080720230703001",
+    "@dcloudio/uni-mp-baidu": "3.0.0-3080720230703001",
+    "@dcloudio/uni-mp-jd": "3.0.0-3080720230703001",
+    "@dcloudio/uni-mp-kuaishou": "3.0.0-3080720230703001",
+    "@dcloudio/uni-mp-lark": "3.0.0-3080720230703001",
+    "@dcloudio/uni-mp-qq": "3.0.0-3080720230703001",
+    "@dcloudio/uni-mp-toutiao": "3.0.0-3080720230703001",
+    "@dcloudio/uni-mp-weixin": "3.0.0-3080720230703001",
+    "@dcloudio/uni-quickapp-webview": "3.0.0-3080720230703001",
+    "@uni-ui/code-ui": "^1.5.3",
+    "big.js": "^6.2.1",
+    "crypto-js": "^4.1.1",
+    "js-base64": "^3.7.5",
+    "uni-crazy-router": "^1.1.3",
+    "uni-vite-plugin-h5-prod-effect": "^1.0.1",
+    "video.js": "^8.3.0",
+    "videojs-flash": "^2.2.1",
+    "vue": "^3.2.47"
+  },
+  "devDependencies": {
+    "@dcloudio/types": "^3.3.3",
+    "@dcloudio/uni-automator": "3.0.0-3080720230703001",
+    "@dcloudio/uni-cli-shared": "3.0.0-3080720230703001",
+    "@dcloudio/uni-stacktracey": "3.0.0-3080720230703001",
+    "@dcloudio/vite-plugin-uni": "3.0.0-3080720230703001",
+    "eslint": "^8.38.0",
+    "eslint-config-standard": "^17.0.0",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-n": "^15.7.0",
+    "eslint-plugin-promise": "^6.1.1",
+    "eslint-plugin-vue": "^9.10.0",
+    "eslint-plugin-vue-scoped-css": "^2.4.0",
+    "husky": "8.0.3",
+    "lint-staged": "13.2.2",
+    "sass": "^1.61.0",
+    "unplugin-auto-import": "^0.15.2",
+    "unplugin-vue-components": "^0.24.1",
+    "vite": "^4.1.5",
+    "vue-eslint-parser": "^9.1.1"
+  },
+  "lint-staged": {
+    "*.{js,vue}": [
+      "eslint --fix"
+    ]
+  }
+}

front-end/mall4uni/src/App.vue

@@ -0,0 +1,15 @@
+<script setup>
+http.getCartCount()
+</script>
+
+<style lang="scss" scoped>
+@import "./app.css";
+/* 隐藏头部 */
+uni-page-head {
+  display: none;
+}
+/* 轮播图指示点 */
+uni-swiper .uni-swiper-dots-horizontal {
+  bottom: 20px !important;
+}
+</style>

front-end/mall4uni/src/app.css

@@ -0,0 +1,109 @@
+/**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;
+  }
+}

front-end/mall4uni/src/components/img-show/img-show.vue

@@ -0,0 +1,79 @@
+<template>
+  <image
+    v-if="!isError && imgPath"
+    :src="imgPath"
+    :style="imgStyle"
+    :class="classList"
+    :mode="imgMode"
+    @error="imgError"
+    @load="imgLoad"
+    @tap="handleTap"
+  />
+  <image
+    v-else
+    :src="defaultImgPath"
+    :style="imgStyle"
+    :class="classList"
+    @tap="handleTap"
+  />
+</template>
+
+<script setup>
+const props = defineProps({
+  src: {
+    type: String,
+    default: ''
+  },
+  imgMode: {
+    type: String,
+    default: 'scaleToFill'
+  },
+  classList: {
+    type: Array,
+    default: () => {
+      return []
+    }
+  },
+  imgStyle: {
+    type: Object,
+    default: () => {
+      return {}
+    }
+  },
+  // 默认失败图片类型, false为默认图片, true为默认头像图片
+  defaultImgType: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const imgPath = computed(() => {
+  return util.checkFileUrl(props.src)
+})
+const defaultImgPath = computed(() => {
+  if (props.defaultImgType) return '/static/images/icon/head04.png'
+  return '/static/images/icon/def.png'
+})
+
+const emit = defineEmits(['imgError', 'imgLoad', 'handleTap'])
+const isError = ref(false)
+const imgError = () => {
+  isError.value = true
+  emit('imgError')
+}
+
+const imgLoad = (e) => {
+  emit('imgLoad', e)
+}
+
+const handleTap = () => {
+  emit('handleTap')
+}
+</script>
+
+<style scoped>
+image {
+  width: 100%;
+  height: 100%;
+}
+</style>

front-end/mall4uni/src/components/production/production.scss

@@ -0,0 +1,67 @@
+.prod-items {
+  width: 43%;
+  background: #fff;
+  margin-bottom: 40rpx;
+  box-sizing: border-box;
+  .hot-imagecont {
+    border-radius: 8rpx;
+    text-align: center;
+    font-size: 0;
+  }
+  .hot-text {
+    margin-top: 20rpx;
+    .prod-info {
+      font-size: 20rpx;
+      color: #777;
+      padding: 0 20rpx;
+      margin-top: 8rpx;
+    }
+    .prod-text-info {
+      position: relative;
+      height: 50rpx;
+      line-height: 70rpx;
+      font-family: Arial;
+      .price {
+        color: #eb2444;
+        padding-left: 20rpx;
+      }
+    }
+  }
+}
+prod {
+  &:nth-child(2n-1) {
+    .prod-items {
+      padding: 20rpx 10rpx 10rpx 20rpx;
+    }
+  }
+  &:nth-child(2n) {
+    .prod-items {
+      padding: 20rpx 20rpx 10rpx 10rpx;
+    }
+  }
+}
+.hot-imagecont {
+  .hotsaleimg {
+    width: 100%;
+    height: 345rpx;
+  }
+}
+.hot-text {
+  .hotprod-text {
+    height: 76rpx;
+    font-size: 28rpx;
+    display: -webkit-box;
+    word-break: break-all;
+    padding: 0 20rpx;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    color: #000;
+  }
+}
+.deadline-price {
+  font-size: 22rpx;
+  margin-right: 5rpx;
+}

front-end/mall4uni/src/components/production/production.vue

@@ -0,0 +1,73 @@
+<template>
+  <view
+    class="prod-items"
+    :data-prodid="item.prodId"
+    @tap="toProdPage"
+  >
+    <view class="hot-imagecont">
+      <image
+        :src="item.pic"
+        class="hotsaleimg"
+      />
+    </view>
+    <view class="hot-text">
+      <view class="hotprod-text">
+        {{ item.prodName }}
+      </view>
+      <view
+        v-if="sts===6"
+        class="prod-info"
+      >
+        {{ 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 setup>
+const wxs = number()
+// eslint-disable-next-line no-unused-vars
+const props = defineProps({
+  item: {
+    type: Object,
+    default: () => {
+      return null
+    }
+  },
+  sts: {
+    type: Number,
+    default: () => {
+      return 2
+    }
+  }
+})
+
+const toProdPage = (e) => {
+  const prodid = e.currentTarget.dataset.prodid
+  uni.navigateTo({
+    url: '/pages/prod/prod?prodid=' + prodid
+  })
+}
+</script>
+
+<style scoped lang="scss">
+@use './production.scss';
+</style>

front-end/mall4uni/src/main.js

@@ -0,0 +1,10 @@
+import {
+  createSSRApp
+} from 'vue'
+import App from './App.vue'
+export function createApp () {
+  const app = createSSRApp(App)
+  return {
+    app
+  }
+}

front-end/mall4uni/src/manifest.json

@@ -0,0 +1,105 @@
+{
+    "name" : "",
+    "appid" : "__UNI__2CF44C6",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    /* 5+App特有相关 */
+    "app-plus" : {
+        "compatible" : {
+            "ignoreVersion" : true //true表示忽略版本检查提示框，HBuilderX1.9.0及以上版本支持
+        },
+        "usingComponents" : true,
+        "nvueStyleCompiler" : "uni-app",
+        "compilerVersion" : 3,
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        /* 模块配置 */
+        "modules" : {
+            "Camera" : {},
+            "LivePusher" : {}
+        },
+        /* 应用发布信息 */
+        "distribute" : {
+            /* android打包配置 */
+            "android" : {
+                "permissions" : [
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+                ],
+                "abiFilters" : [ "armeabi-v7a", "arm64-v8a", "x86" ]
+            }
+        }
+    },
+    /* 小程序特有相关 */
+    "mp-weixin" : {
+        "appid" : "wx6fa71e69231a4fa4",
+        "setting" : {
+            "urlCheck" : false
+        },
+        "usingComponents" : true,
+        "permission" : {
+            "scope.userLocation" : {
+                "desc" : "你的位置信息将用于地址信息新增、修改以及获取附近门店"
+            }
+        },
+        "plugins" : {
+            "live-player-plugin" : {
+                "version" : "1.3.5",
+                "provider" : "wx2b03c6e691cd7370"
+            }
+        },
+        "requiredPrivateInfos" : [ "getLocation", "chooseLocation" ]
+    },
+    "h5" : {
+        "title" : "",
+        "domain" : "https://mini-h5.mall4j.com",
+        "router" : {
+            "mode" : "history"
+        },
+        "uniStatistics" : {
+            "enable" : false
+        },
+        "optimization" : {
+            "treeShaking" : {
+                "enable" : false
+            }
+        },
+        "template" : "index.html",
+        "devServer" : {
+            "disableHostCheck" : true,
+            "port" : 80
+        },
+        "sdkConfigs" : {
+            "maps" : {
+                "qqmap" : {
+                    // 用于h5端ip定位
+                    "key" : ""
+                }
+            }
+        }
+    },
+    "uniStatistics" : {
+        "enable" : false
+    },
+    "vueVersion" : "3"
+}

front-end/mall4uni/src/pages.json

@@ -0,0 +1,197 @@
+{
+  "pages": [
+    {
+      "path": "pages/index/index",
+      "style": {
+        "backgroundTextStyle": "dark",
+        "navigationBarBackgroundColor": "#fff",
+        "navigationBarTextStyle": "black",
+        "enablePullDownRefresh": true,
+        "navigationBarTitleText": "mall4j"
+      }
+    },
+    {
+      "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/sub-category/sub-category"
+    },
+    {
+      "path": "pages/search-page/search-page",
+      "style": {
+        "backgroundTextStyle": "light",
+        "navigationBarBackgroundColor": "#fff",
+        "navigationBarTitleText": "搜索",
+        "navigationBarTextStyle": "black",
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "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/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/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": []
+}

front-end/mall4uni/src/pages/accountLogin/accountLogin.scss

@@ -0,0 +1,124 @@
+.con {
+  background: #fff;
+  height: 100%;
+  margin-top: 50px;
+}
+image {
+  display: block;
+  width: 150rpx;
+  height: 150rpx;
+  margin: auto;
+  border-radius: 50%;
+  width: 150rpx;
+  height: 150rpx;
+  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;
+  border: 1rpx solid #0ab906;
+  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;
+  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;
+  margin-bottom: 50rpx;
+  font-size: 32rpx;
+}
+.item {
+  display: block;
+  margin-bottom: 30rpx;
+  margin-bottom: 30rpx;
+}
+.account {
+  display: flex;
+  background: #f8f8f8;
+  padding: 15rpx;
+  box-sizing: border-box;
+  font-size: 26rpx;
+  align-items: center;
+  input {
+    padding-left: 20rpx;
+    width: 75%;
+    padding-left: 20rpx;
+  }
+}
+button {
+  &::after {
+    border: 0 !important;
+  }
+}
+.operate {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.to-register {
+  font-size: 28rpx;
+  color: #00AAFF;
+  font-size: 28rpx;
+}
+.error {
+  .error-text {
+    display: block;
+    width: 100%;
+    font-size: 28rpx;
+    color: #e43130;
+    text-align: left;
+    margin-top: 10rpx;
+    font-size: 28rpx;
+    margin-top: 10rpx;
+    .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;
+      width: 26rpx;
+      height: 26rpx;
+      line-height: 26rpx;
+      margin-right: 12rpx;
+      font-size: 22rpx;
+    }
+  }
+}

front-end/mall4uni/src/pages/accountLogin/accountLogin.vue

@@ -0,0 +1,174 @@
+<template>
+  <view class="con">
+    <image src="@/static/logo.png" />
+    <!-- 登录 -->
+    <view class="login-form">
+      <view :class="['item',errorTips==1? 'error':'']">
+        <view class="account">
+          <text class="input-item">
+            账号
+          </text>
+          <input
+            type="text"
+            data-type="account"
+            placeholder-class="inp-palcehoder"
+            placeholder="请输入用户名"
+            @input="getInputVal"
+          >
+        </view>
+        <view
+          v-if="errorTips==1"
+          class="error-text"
+        >
+          <text class="warning-icon">
+            !
+          </text>
+          请输入账号！
+        </view>
+      </view>
+      <view :class="['item',errorTips==2? 'error':'']">
+        <view class="account">
+          <text class="input-item">
+            密码
+          </text>
+          <input
+            type="password"
+            data-type="password"
+            placeholder-class="inp-palcehoder"
+            placeholder="请输入密码"
+            @input="getInputVal"
+          >
+        </view>
+        <view
+          v-if="errorTips==2"
+          class="error-text"
+        >
+          <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 setup>
+import { encrypt } from '@/utils/crypto.js'
+
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  // 头部导航标题
+  uni.setNavigationBarTitle({
+    title: '用户登录'
+  })
+})
+
+const principal = ref('') // 账号
+const errorTips = ref(0) // 错误提示
+watch(
+  () => principal.value,
+  () => {
+    errorTips.value = 0
+  }
+)
+
+const credentials = ref('') // 密码
+/**
+ * 输入框的值
+ */
+const getInputVal = (e) => {
+  const type = e.currentTarget.dataset.type
+  if (type == 'account') {
+    principal.value = e.detail.value
+  } else if (type == 'password') {
+    credentials.value = e.detail.value
+  }
+}
+
+/**
+ * 登录
+ */
+const login = () => {
+  if (principal.value.length == 0) {
+    errorTips.value = 1
+  } else if (credentials.value.length == 0) {
+    errorTips.value = 2
+  } else {
+    errorTips.value = 0
+    // #ifdef H5 || APP-PLUS
+    http.request({
+      url: '/login',
+      method: 'post',
+      data: {
+        userName: principal.value,
+        passWord: encrypt(credentials.value)
+      }
+    })
+      .then(({ data }) => {
+        http.loginSuccess(data, () => {
+          uni.showToast({
+            title: '登录成功',
+            icon: 'none',
+            complete: () => {
+              setTimeout(() => {
+                wx.switchTab({
+                  url: '/pages/index/index'
+                })
+              }, 1000)
+            }
+          })
+        })
+      })
+    // #endif
+  }
+}
+
+/**
+ * 去注册
+ */
+const toRegitser = () => {
+  uni.navigateTo({
+    url: '/pages/register/register'
+  })
+}
+
+/**
+ * 回到首页
+ */
+const toIndex = () => {
+  wx.switchTab({
+    url: '/pages/index/index'
+  })
+}
+</script>
+
+<style scoped lang="scss">
+@import "./accountLogin.scss";
+</style>

front-end/mall4uni/src/pages/basket/basket.scss

@@ -0,0 +1,365 @@
+.container {
+  width: 100%;
+  background: #f4f4f4;
+  min-height: calc(100vh - 118rpx);
+}
+.prod-list {
+  padding-bottom: 118rpx;
+  width: 100%;
+  .prod-block {
+    background: #fff;
+    margin-top: 15rpx;
+    .discount-tips {
+      padding: 20rpx 0 20rpx 20rpx;
+      border-bottom: 2rpx solid #f4f4f4;
+      height: 40rpx;
+      line-height: 40rpx;
+      .text-block {
+        padding: 3rpx 5rpx;
+        border-radius: 8rpx;
+        font-size: 22rpx;
+        color: #eb2444;
+        border: 2rpx solid #eb2444;
+      }
+      .text-list {
+        font-size: 24rpx;
+        margin-left: 10rpx;
+      }
+    }
+  }
+  .item {
+    background: #fff;
+    display: flex;
+    align-items: center;
+    padding: 20rpx;
+    .prodinfo {
+      position: relative;
+      color: #999;
+      width: 100%;
+      &::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;
+      }
+      .pic {
+        text-align: center;
+        width: 180rpx;
+        height: 180rpx;
+        line-height: 180rpx;
+        font-size: 0;
+      }
+    }
+    &:last-child {
+      .prodinfo {
+        &::after {
+          height: 0;
+        }
+      }
+    }
+    .staus {
+      text-align: center;
+      background: rgb(196, 192, 192);
+      font-size: 20rpx;
+      width: 50rpx;
+      color: #fff;
+    }
+    .opt {
+      font-size: 28rpx;
+      margin-left: 20rpx;
+      width: 100%;
+    }
+    .pic {
+      image {
+        max-width: 100%;
+        max-height: 100%;
+        vertical-align: middle;
+      }
+    }
+  }
+  .lose-efficacy {
+    .discount-tips {
+      padding: 20rpx 0;
+      border-bottom: 2rpx solid #ddd;
+      height: 50rpx;
+      line-height: 50rpx;
+      margin-left: 20rpx;
+      .text-list {
+        font-size: 30rpx;
+        margin-left: 10rpx;
+      }
+    }
+  }
+}
+.prodinfo {
+  display: flex;
+  margin-left: 20rpx;
+  .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;
+    }
+    .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;
+    }
+    .prod-info-text.empty-n {
+      padding: 0;
+    }
+    .price-count {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      .price {
+        color: #eb2444;
+      }
+    }
+  }
+}
+.prod-info-text {
+  &:before {
+    border-top: 5px solid #aaa;
+  }
+  &:after {
+    border-top: 5px solid #f9f9f9;
+    top: 9px;
+  }
+}
+.lose-efficacy {
+  .prodinfo {
+    .opt {
+      .price-count {
+        .price {
+          color: #999;
+        }
+      }
+    }
+  }
+  margin-top: 20rpx;
+  background: #fff;
+  .item {
+    background: #f8f8f9;
+  }
+  .discount-tips {
+    .empty-prod {
+      color: #777;
+      font-size: 26rpx;
+      border: 2rpx solid #999;
+      padding: 0 10rpx;
+      border-radius: 8rpx;
+      float: right;
+      margin-right: 20rpx;
+    }
+  }
+}
+.m-numSelector {
+  .minus {
+    float: left;
+    box-sizing: border-box;
+    height: 56rpx;
+    border: 2rpx solid #d9d9d9;
+    position: relative;
+    width: 56rpx;
+    border-right: 0;
+    border-top-left-radius: 4rpx;
+    border-bottom-left-radius: 4rpx;
+    &::before {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      margin: auto;
+      content: ' ';
+      width: 22rpx;
+      height: 3rpx;
+      background-color: #7f7f7f;
+    }
+  }
+  input {
+    float: left;
+    box-sizing: border-box;
+    height: 56rpx;
+    border: 2rpx solid #d9d9d9;
+    width: 56rpx;
+    text-align: center;
+    color: #333;
+  }
+  .plus {
+    float: left;
+    box-sizing: border-box;
+    height: 56rpx;
+    border: 2rpx solid #d9d9d9;
+    position: relative;
+    width: 56rpx;
+    border-left: 0;
+    border-top-right-radius: 4rpx;
+    border-bottom-right-radius: 4rpx;
+    &::before {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      margin: auto;
+      content: ' ';
+      width: 22rpx;
+      height: 3rpx;
+      background-color: #7f7f7f;
+    }
+    &::after {
+      position: absolute;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      margin: auto;
+      content: ' ';
+      width: 22rpx;
+      height: 3rpx;
+      background-color: #7f7f7f;
+      transform: rotate(90deg);
+    }
+  }
+  float: right;
+  &:not(.disabled) {
+    .minus {
+      &:not(.disabled) {
+        &:active {
+          background-color: #f4f4f4;
+        }
+      }
+    }
+    .plus {
+      &:not(.disabled) {
+        &:active {
+          background-color: #f4f4f4;
+        }
+      }
+    }
+  }
+}
+:deep(checkbox) {
+  .uni-checkbox-input,
+  .wx-checkbox-input {
+    border-radius: 50%;
+    width: 35rpx;
+    height: 35rpx;
+  }
+  .wx-checkbox-input.wx-checkbox-input-checked {
+    background: #eb2444;
+    border-color: #eb2444;
+    &::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: 26rpx;
+  color: #aaa;
+  padding-top: 200rpx;
+  .txt {
+    text-align: center;
+    margin-top: 30rpx;
+  }
+  .img {
+    margin-top: 80rpx;
+    text-align: center;
+    image {
+      width: 80rpx;
+      height: 80rpx;
+    }
+  }
+}
+.price-count {
+  .disable-price {
+    color: #999;
+  }
+}
+.cart-footer {
+  position: fixed;
+  bottom: calc(90rpx + env(safe-area-inset-bottom));
+  left: 0;
+  width: 100%;
+  display: flex;
+  flex-direction: row nowrap;
+  height: 98rpx;
+  border-top: 2rpx solid #f4f4f4;
+  z-index: 999;
+  .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;
+    .total-msg {
+      font-size: 20rpx;
+    }
+  }
+  .btn.total {
+    display: flex;
+    flex-flow: column;
+    align-items: flex-start;
+    width: 300rpx;
+    .price {
+      color: #eb2444;
+      font-size: 30rpx;
+    }
+  }
+  .btn.del {
+    color: #eb2444;
+    width: 70rpx;
+    font-size: 22rpx;
+    text-align: left;
+    display: block;
+    line-height: 102rpx;
+  }
+  .btn.all {
+    width: 150rpx;
+    font-size: 26rpx;
+    label {
+      display: flex;
+      flex-grow: 1;
+      justify-content: center;
+      align-items: center;
+    }
+  }
+  .btn.settle {
+    width: 200rpx;
+    background: #eb2444;
+    color: #fff;
+  }
+}

front-end/mall4uni/src/pages/basket/basket.vue

@@ -0,0 +1,401 @@
+<template>
+  <view class="container">
+    <view class="prod-list">
+      <block
+        v-for="(item, scIndex) in shopCartItemDiscounts"
+        :key="scIndex"
+      >
+        <view class="prod-block">
+          <view
+            v-if="item.chooseDiscountItemDto"
+            class="discount-tips"
+          >
+            <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
+                    :data-scindex="scIndex"
+                    :data-index="index"
+                    :value="prod.prodId"
+                    :checked="prod.checked"
+                    color="#105c3e"
+                    @tap="onSelectedItem"
+                  />
+                </label>
+              </view>
+              <view class="prodinfo">
+                <view class="pic">
+                  <image :src="prod.pic" />
+                </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
+                        class="minus"
+                        :data-scindex="scIndex"
+                        :data-index="index"
+                        @tap="onCountMinus"
+                      />
+                      <input
+                        type="number"
+                        :value="prod.prodCount"
+                        disabled
+                      >
+                      <view
+                        class="plus"
+                        :data-scindex="scIndex"
+                        :data-index="index"
+                        @tap="onCountPlus"
+                      />
+                    </view>
+                  </view>
+                </view>
+              </view>
+            </view>
+          </block>
+        </view>
+      </block>
+    </view>
+
+    <view
+      v-if="!shopCartItemDiscounts.length"
+      class="empty"
+    >
+      <view class="img">
+        <image src="@/static/images/tabbar/basket.png" />
+      </view>
+      <view class="txt">
+        您还没有添加任何商品哦~
+      </view>
+    </view>
+
+    <!-- 底部按钮 -->
+    <view
+      v-if="shopCartItemDiscounts.length>0"
+      class="cart-footer"
+    >
+      <view class="btn all">
+        <checkbox
+          :checked="allChecked"
+          color="#f7d731;"
+          @tap="onSelAll"
+        />
+        全选
+      </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
+          v-if="subtractMoney>0"
+          class="total-msg"
+        >
+          总额:￥{{ wxs.toPrice(totalMoney) }} 立减:￥{{ wxs.toPrice(subtractMoney) }}
+        </view>
+      </view>
+      <view
+        class="btn settle"
+        @tap="toFirmOrder"
+      >
+        <text>结算</text>
+      </view>
+    </view>
+    <!-- end 底部按钮 -->
+  </view>
+</template>
+
+<script setup>
+const wxs = number()
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  loadBasketData()
+  http.getCartCount() // 重新计算购物车总数量
+})
+
+const allChecked = ref(false)
+const shopCartItemDiscounts = ref([])
+const loadBasketData = () => {
+  uni.showLoading() // 加载购物车
+  http.request({
+    url: '/p/shopCart/info',
+    method: 'POST',
+    data: {}
+  })
+    .then(({ data }) => {
+      if (data.length > 0) {
+      // 默认不选中
+        const shopCartItemDiscountsParam = data[0].shopCartItemDiscounts
+        shopCartItemDiscountsParam.forEach(shopCartItemDiscount => {
+          shopCartItemDiscount.shopCartItems.forEach(shopCartItem => {
+            shopCartItem.checked = false
+          })
+        })
+        shopCartItemDiscounts.value = shopCartItemDiscountsParam
+        allChecked.value = false
+      } else {
+        shopCartItemDiscounts.value = []
+      }
+      calTotalPrice() // 计算总价
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 去结算
+ */
+const toFirmOrder = () => {
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  const basketIds = []
+  shopCartItemDiscountsParam.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'
+  })
+}
+
+/**
+ * 全选
+ */
+const onSelAll = () => {
+  const allCheckedParam = !allChecked.value // 改变状态
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  for (let i = 0; i < shopCartItemDiscountsParam.length; i++) {
+    const cItems = shopCartItemDiscountsParam[i].shopCartItems
+    for (let j = 0; j < cItems.length; j++) {
+      cItems[j].checked = allCheckedParam
+    }
+  }
+  allChecked.value = allCheckedParam
+  shopCartItemDiscounts.value = shopCartItemDiscountsParam
+  calTotalPrice() // 计算总价
+}
+
+/**
+ * 每一项的选择事件
+ * +
+ */
+const onSelectedItem = (e) => {
+  const index = e.currentTarget.dataset.index // 获取data- 传进来的index
+  const scindex = e.currentTarget.dataset.scindex
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value // 获取购物车列表
+  const checked = shopCartItemDiscountsParam[scindex].shopCartItems[index].checked // 获取当前商品的选中状态
+  shopCartItemDiscountsParam[scindex].shopCartItems[index].checked = !checked // 改变状态
+  shopCartItemDiscounts.value = shopCartItemDiscountsParam
+  checkAllSelected() // 检查全选状态
+  calTotalPrice() // 计算总价
+}
+
+/**
+ * 检查全选状态
+ */
+const checkAllSelected = () => {
+  let allCheckedParam = true
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  let flag = false
+  for (let i = 0; i < shopCartItemDiscountsParam.length; i++) {
+    const cItems = shopCartItemDiscountsParam[i].shopCartItems
+    for (let j = 0; j < cItems.length; j++) {
+      if (!cItems[j].checked) {
+        allCheckedParam = !allCheckedParam
+        flag = true
+        break
+      }
+    }
+    if (flag) break
+  }
+  allChecked.value = allCheckedParam
+}
+
+const totalMoney = ref(0)
+const subtractMoney = ref(0)
+const finalMoney = ref(0)
+/**
+ * 计算购物车总额
+ */
+const calTotalPrice = () => {
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  const shopCartIds = []
+  for (let i = 0; i < shopCartItemDiscountsParam.length; i++) {
+    const cItems = shopCartItemDiscountsParam[i].shopCartItems
+    for (let j = 0; j < cItems.length; j++) {
+      if (cItems[j].checked) {
+        shopCartIds.push(cItems[j].basketId)
+      }
+    }
+  }
+  uni.showLoading()
+  http.request({
+    url: '/p/shopCart/totalPay',
+    method: 'POST',
+    data: shopCartIds
+  })
+    .then(({ data }) => {
+      finalMoney.value = data.finalMoney
+      totalMoney.value = data.totalMoney
+      subtractMoney.value = data.subtractMoney
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 减少数量
+ */
+const onCountMinus = (e) => {
+  const index = e.currentTarget.dataset.index
+  const scindex = e.currentTarget.dataset.scindex
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  const prodCount = shopCartItemDiscountsParam[scindex].shopCartItems[index].prodCount
+  if (prodCount > 1) {
+    updateCount(shopCartItemDiscountsParam, scindex, index, -1)
+  }
+}
+
+/**
+ * 增加数量
+ */
+const onCountPlus = (e) => {
+  const index = e.currentTarget.dataset.index
+  const scindex = e.currentTarget.dataset.scindex
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  updateCount(shopCartItemDiscountsParam, scindex, index, 1)
+}
+
+/**
+ * 改变购物车数量接口
+ */
+const updateCount = (shopCartItemDiscountsParam, scindex, index, prodCount) => {
+  uni.showLoading({
+    mask: true
+  })
+  http.request({
+    url: '/p/shopCart/changeItem',
+    method: 'POST',
+    data: {
+      count: prodCount,
+      prodId: shopCartItemDiscountsParam[scindex].shopCartItems[index].prodId,
+      skuId: shopCartItemDiscountsParam[scindex].shopCartItems[index].skuId,
+      shopId: 1
+    }
+  })
+    .then(() => {
+      shopCartItemDiscountsParam[scindex].shopCartItems[index].prodCount += prodCount
+      shopCartItemDiscounts.value = shopCartItemDiscountsParam
+      calTotalPrice() // 计算总价
+      uni.hideLoading()
+      http.getCartCount() // 重新计算购物车总数量
+    })
+}
+
+/**
+ * 删除购物车商品
+ */
+const onDelBasket = () => {
+  const shopCartItemDiscountsParam = shopCartItemDiscounts.value
+  const basketIds = []
+  for (let i = 0; i < shopCartItemDiscountsParam.length; i++) {
+    const cItems = shopCartItemDiscountsParam[i].shopCartItems
+    for (let j = 0; j < cItems.length; j++) {
+      if (cItems[j].checked) {
+        basketIds.push(cItems[j].basketId)
+      }
+    }
+  }
+  if (!basketIds.length) {
+    uni.showToast({
+      title: '请选择商品',
+      icon: 'none'
+    })
+  } else {
+    uni.showModal({
+      title: '',
+      content: '确认要删除选中的商品吗？',
+      confirmColor: '#eb2444',
+      success (res) {
+        if (res.confirm) {
+          uni.showLoading({
+            mask: true
+          })
+          http.request({
+            url: '/p/shopCart/deleteItem',
+            method: 'DELETE',
+            data: basketIds
+          })
+            .then(() => {
+              uni.hideLoading()
+              loadBasketData()
+            })
+        }
+      }
+
+    })
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import "./basket.scss";
+</style>

front-end/mall4uni/src/pages/category/category.scss

@@ -0,0 +1,225 @@
+.container {
+  display: flex;
+  flex-direction: row;
+  height: 100%;
+}
+.main {
+  position: fixed;
+  display: flex;
+  overflow: hidden;
+  height: 100%;
+}
+.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;
+  .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-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;
+    .search-img {
+      width: 32rpx;
+      height: 32rpx;
+      margin-right: 10rpx;
+    }
+  }
+  .search-hint {
+    font-size: 28rpx;
+    position: absolute;
+    right: 30rpx;
+    top: 32rpx;
+  }
+}
+.sear-input {
+  font-size: 28rpx;
+}
+.leftmenu {
+  width: 200rpx;
+  height: 100%;
+  box-sizing: border-box;
+  background-color: #f5f6f7;
+  overflow: scroll;
+  z-index: 2;
+  .ca-empty {
+    padding-top: 400rpx;
+    text-align: center;
+    color: #aaa;
+    font-size: 24rpx;
+  }
+}
+.menu-item {
+  line-height: 90rpx;
+  height: 90rpx;
+  text-align: center;
+  border-bottom: 2rpx silid #e3e3e3;
+  position: relative;
+  color: #777;
+  font-size: 28rpx;
+  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;
+  }
+}
+.menu-item.active {
+  color: #eb2444;
+  font-size: 28rpx;
+  font-weight: bold;
+  position: relative;
+  background: #fff;
+  &:before {
+    position: absolute;
+    left: 0;
+    content: "";
+    width: 8rpx;
+    height: 32rpx;
+    top: 29rpx;
+    background: #eb2444;
+  }
+}
+.rightcontent {
+  width: 550rpx;
+  height: 100%;
+  box-sizing: border-box;
+  background-color: #fff;
+  z-index: 1;
+  .adver-map {
+    width: auto;
+    box-sizing: border-box;
+    overflow: hidden;
+    position: relative;
+    margin: 30rpx 20rpx 0;
+    .item-a {
+      display: block;
+      font-size: 0;
+      width: 100%;
+      image {
+        max-width: 100%;
+      }
+    }
+  }
+  .cont-item {
+    padding: 0 20rpx 20rpx 20rpx;
+    padding-bottom: 94rpx;
+    .show-item {
+      .more-prod-pic {
+        text-align: center;
+        width: 150rpx;
+        height: 150rpx;
+        line-height: 150rpx;
+        font-size: 0;
+        .more-pic {
+          max-width: 100%;
+          max-height: 100%;
+          border-radius: 8rpx;
+          vertical-align: middle;
+        }
+      }
+      position: relative;
+      display: flex;
+      justify-content: flex-start;
+      padding: 20rpx 0;
+      &::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;
+      }
+      .prod-text-right {
+        margin-left: 20rpx;
+        width: 75%;
+        .cate-prod-info {
+          font-size: 22rpx;
+          color: #999;
+          margin: 10rpx 0 20rpx 0;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          -webkit-line-clamp: 1;
+          overflow: hidden;
+        }
+        .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;
+        }
+        .prod-price.more {
+          font-size: 28rpx;
+          color: #eb2444;
+          font-family: arial;
+        }
+      }
+    }
+  }
+}
+.th-cate-con {
+  display: flex;
+  flex-wrap: wrap;
+}
+.sub-category {
+  width: 33.33%;
+  display: flex;
+  flex-direction: column;
+  padding: 30rpx;
+  box-sizing: border-box;
+  align-items: center;
+}
+.sub-category-item {
+  >.more-pic {
+    width: 120rpx;
+    height: 120rpx;
+    padding-bottom: 10rpx;
+  }
+  text {
+    font-size: 25rpx;
+    word-break: break-word;
+  }
+}
+.cont-item.empty {
+  display: block;
+  font-size: 24rpx;
+  color: #aaa;
+  text-align: center;
+}

front-end/mall4uni/src/pages/category/category.vue

@@ -0,0 +1,172 @@
+<template>
+  <view class="container">
+    <!-- 头部搜索区 -->
+    <view class="search-bar">
+      <view
+        class="search-box"
+        @tap="toSearchPage"
+      >
+        <image
+          src="@/static/images/icon/search.png"
+          class="search-img"
+        />
+        <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>
+        <view
+          v-if="!categoryList || !categoryList.length"
+          class="ca-empty"
+        >
+          {{ categoryList && categoryList.length ? '该分类下暂无商品' : '暂无商品' }}
+        </view>
+      </scroll-view>
+      <!-- 左侧菜单end -->
+
+      <!-- 右侧内容start -->
+      <scroll-view
+        scroll-y="true"
+        class="rightcontent"
+      >
+        <view class="adver-map">
+          <view class="item-a">
+            <image
+              :src="categoryImg"
+              mode="widthFix"
+            />
+          </view>
+        </view>
+        <!-- 子分类 -->
+        <view
+          v-if="subCategoryList.length"
+          class="th-cate-con"
+        >
+          <block
+            v-for="(thCateItem, index) in subCategoryList"
+            :key="index"
+          >
+            <view class="sub-category">
+              <view
+                class="sub-category-item"
+                :data-categoryid="thCateItem.categoryId"
+                :data-parentid="thCateItem.parentId"
+                @tap="toCatePage"
+              >
+                <image
+                  :src="thCateItem.pic"
+                  class="more-pic"
+                  mode="widthFix"
+                />
+                <text>{{ thCateItem.categoryName }}</text>
+              </view>
+            </view>
+          </block>
+        </view>
+        <view
+          v-else
+          class="cont-item empty"
+        >
+          该分类下暂无子分类~
+        </view>
+      </scroll-view>
+      <!-- 右侧内容end -->
+    </view>
+  </view>
+</template>
+
+<script setup>
+const categoryList = ref([])
+const subCategoryList = ref([])
+const categoryImg = ref('')
+const parentId = ref('')
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad(() => {
+  // 加载分类列表
+  http.request({
+    url: '/category/categoryInfo',
+    method: 'GET',
+    data: {
+      parentId: ''
+    }
+  })
+    .then(({ data }) => {
+      categoryImg.value = data[0].pic
+      categoryList.value = data
+      getProdList(data[0].categoryId)
+      parentId.value = categoryList.value[0].categoryId
+    })
+})
+
+const selIndex = ref(0)
+/**
+ * 分类点击事件
+ */
+const onMenuTab = (e) => {
+  const index = e.currentTarget.dataset.index
+  getProdList(categoryList.value[index].categoryId)
+  parentId.value = categoryList.value[index].categoryId
+  categoryImg.value = categoryList.value[index].pic
+  selIndex.value = index
+}
+
+/**
+ * 跳转搜索页
+ */
+const toSearchPage = () => {
+  uni.navigateTo({
+    url: '/pages/search-page/search-page'
+  })
+}
+
+const getProdList = (categoryId) => {
+  // 加载分类列表
+  http.request({
+    url: '/category/categoryInfo',
+    method: 'GET',
+    data: {
+      parentId: categoryId
+    }
+  })
+    .then(({ data }) => {
+      subCategoryList.value = data
+    })
+}
+
+/**
+ * 跳转子分类商品页面
+ */
+const toCatePage = (e) => {
+  const { categoryid } = e.currentTarget.dataset
+  uni.navigateTo({
+    url: `/pages/sub-category/sub-category?parentId=${parentId.value}&categoryId=${categoryid}`
+  })
+}
+
+</script>
+
+<style scoped lang="scss">
+@import "./category.scss";
+</style>

front-end/mall4uni/src/pages/delivery-address/delivery-address.scss

@@ -0,0 +1,93 @@
+.container {
+  background-color: #f4f4f4;
+  border-top: 2rpx solid #e9eaec;
+  min-height: 100vh;
+}
+.main {
+  margin-top: 20rpx;
+  padding-bottom: 150rpx;
+}
+.address {
+  margin-bottom: 15rpx;
+  width: 100%;
+  background-color: #fff;
+  border-bottom: 2rpx solid #e9eaec;
+  .personal {
+    position: relative;
+    padding: 20rpx 30rpx;
+    border-bottom: 3rpx dashed #e9eaec;
+    .info-tit {
+      .name {
+        margin-right: 30rpx;
+        font-size: 32rpx;
+        display: inline-block;
+      }
+      .tel {
+        font-size: 30rpx;
+      }
+      image {
+        position: absolute;
+        right: 30rpx;
+        top: 46rpx;
+        width: 40rpx;
+        height: 40rpx;
+        margin-left: 50rpx;
+        vertical-align: middle;
+      }
+    }
+  }
+  .select-btn {
+    padding: 15rpx 30rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .box {
+      font-size: 26rpx;
+    }
+  }
+}
+.personal {
+  .addr {
+    font-size: 26rpx;
+    margin: 10rpx 0;
+    margin-top: 20rpx;
+    .addr-get {
+      display: inline-block;
+      color: #999;
+      width: 100%;
+      word-break: break-word;
+    }
+  }
+}
+.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);
+  text {
+    font-size: 32rpx;
+    color: #eb2444;
+  }
+}
+.empty {
+  .img {
+    text-align: center;
+    margin-top: 130rpx;
+    image {
+      width: 100rpx;
+      height: 100rpx;
+      display: block;
+      margin: auto;
+    }
+  }
+  .txt {
+    margin-top: 30rpx;
+    font-size: 24rpx;
+    text-align: center;
+    color: #999;
+  }
+}

front-end/mall4uni/src/pages/delivery-address/delivery-address.vue

@@ -0,0 +1,160 @@
+<template>
+  <view class="container">
+    <view class="main">
+      <view
+        v-if="addressList.length===0"
+        class="empty"
+      >
+        <view class="img">
+          <image src="http://jiales.gz-yami.com/addr.png" />
+        </view>
+        <view class="txt">
+          您还没有收货地址
+        </view>
+      </view>
+      <radio-group class="radio-group">
+        <block
+          v-for="(item, index) in addressList"
+          :key="index"
+        >
+          <view class="address">
+            <view
+              class="personal"
+              @tap="selAddrToOrder(item)"
+            >
+              <view class="info-tit">
+                <text class="name">
+                  {{ item.receiver }}
+                </text>
+                <text class="tel">
+                  {{ item.mobile }}
+                </text>
+                <image
+                  src="@/static/images/icon/revise.png"
+                  :data-addrid="item.addrId"
+                  @tap.stop="toEditAddress"
+                />
+              </view>
+              <view class="addr">
+                <text class="addr-get">
+                  {{ item.province }}{{ item.city }}{{ item.area }}{{ item.addr }}
+                </text>
+              </view>
+            </view>
+            <view
+              class="select-btn"
+              :data-addrid="item.addrId"
+              @tap="onDefaultAddr"
+            >
+              <view class="box">
+                <radio
+                  :value="item.prodId"
+                  :checked="item.commonAddr==1"
+                  color="#eb2444"
+                  :data-addrid="item.addrId"
+                  @tap="onDefaultAddr"
+                />
+                设为默认地址
+              </view>
+            </view>
+          </view>
+        </block>
+      </radio-group>
+    </view>
+    <view
+      class="footer"
+      @tap="onAddAddr"
+    >
+      <text>新增收货地址</text>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const order = ref(-1)
+onLoad((option) => {
+  if (option.order) {
+    order.value = option.order
+  }
+})
+
+const addressList = ref([])
+/**
+ * 加载地址列表
+ */
+onShow(() => {
+  onGetList()
+})
+
+/**
+ * 获取收获列表接口
+ */
+const onGetList = () => {
+  uni.showLoading()
+  http.request({
+    url: '/p/address/list',
+    method: 'GET'
+  })
+    .then(({ data }) => {
+      addressList.value = data
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 新增收货地址
+ */
+const onAddAddr = () => {
+  uni.navigateTo({
+    url: '/pages/editAddress/editAddress'
+  })
+}
+
+/**
+ * 设置为默认地址
+ */
+const onDefaultAddr = (e) => {
+  const addrId = e.currentTarget.dataset.addrid
+  uni.showLoading()
+  http.request({
+    url: '/p/address/defaultAddr/' + addrId,
+    method: 'PUT',
+    data: {
+      addrId
+    }
+  })
+    .then(() => {
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 修改地址
+ */
+const toEditAddress = (e) => {
+  const addrId = e.currentTarget.dataset.addrid
+  uni.navigateTo({
+    url: '/pages/editAddress/editAddress?addrId=' + addrId
+  })
+}
+
+/**
+ * 选择地址 跳转回提交订单页
+ */
+const selAddrToOrder = (item) => {
+  if (order.value == 0) {
+    const pages = getCurrentPages() // 当前页面
+    const prevPage = pages[pages.length - 2] // 上一页面
+    prevPage.item = item // 直接给上一页面赋值
+    prevPage.selAddress = 'yes'
+    // 返回
+    uni.navigateBack({
+      delta: 1
+    })
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@use './delivery-address.scss';
+</style>

front-end/mall4uni/src/pages/editAddress/editAddress.scss

@@ -0,0 +1,158 @@
+.container {
+  background: #fff;
+}
+.input-box {
+  margin-bottom: 50rpx;
+  background: #fff;
+  padding: 0 20rpx;
+  .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;
+    text {
+      width: 20%;
+      color: #333;
+    }
+    input {
+      width: 70%;
+      padding: 0 20rpx;
+      color: #333;
+    }
+    picker {
+      width: 70%;
+      padding: 0 30rpx;
+    }
+    .pca {
+      width: 70%;
+      padding: 0 20rpx;
+    }
+    .arrow {
+      width: 28rpx;
+      height: 28rpx;
+      image {
+        width: 100%;
+        height: 100%;
+        vertical-align: top;
+      }
+    }
+  }
+}
+.btn-box {
+  padding: 5px 10px;
+  width: 100%;
+  text-align: center;
+  margin: auto;
+  text {
+    font-size: 30rpx;
+  }
+  .clear.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);
+    margin-top: 40rpx;
+    color: #eb2444;
+    background-color: #f8f0f1b6;
+  }
+  .keep {
+    color: #fff;
+    background-color: #eb2444;
+  }
+}
+.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);
+}
+.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;
+  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;
+  }
+}
+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;
+}
+.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;
+}

front-end/mall4uni/src/pages/editAddress/editAddress.vue

@@ -0,0 +1,435 @@
+<template>
+  <view class="container">
+    <!--input列表 -->
+    <view class="input-box">
+      <view class="section">
+        <text>收 货 人</text>
+        <input
+          placeholder="姓名"
+          type="text"
+          maxlength="15"
+          :value="receiver"
+          @input="onReceiverInput"
+        >
+      </view>
+      <view class="section">
+        <text>手机号码</text>
+        <input
+          placeholder="11位手机号码"
+          type="number"
+          maxlength="11"
+          :value="mobile"
+          @input="onMobileInput"
+        >
+      </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.stop="hiddenFloatView"
+        >
+          <view
+            class="animation-element"
+            @tap.stop="nono"
+          >
+            <text
+              class="right-bt"
+              @tap.stop="hiddenFloatView"
+            >
+              确定
+            </text>
+            <view class="line" />
+            <picker-view
+              indicator-style="height: 50rpx;"
+              :value="valArr"
+              @change="bindChange"
+              @tap.stop="nono"
+            >
+              <!--省-->
+              <picker-view-column>
+                <view
+                  v-for="(item, indexs) in provArray"
+                  :key="indexs"
+                >
+                  {{ item.areaName }}
+                </view>
+              </picker-view-column>
+              <!--地级市-->
+              <picker-view-column>
+                <view
+                  v-for="(item, indexss) in cityArray"
+                  :key="indexss"
+                >
+                  {{ item.areaName }}
+                </view>
+              </picker-view-column>
+              <!--区县-->
+              <picker-view-column>
+                <view
+                  v-for="(item, indexsss) in areaArray"
+                  :key="indexsss"
+                >
+                  {{ item.areaName }}
+                </view>
+              </picker-view-column>
+            </picker-view>
+          </view>
+        </view>
+
+        <view class="arrow">
+          <image src="@/static/images/icon/more.png" />
+        </view>
+      </view>
+      <view class="section">
+        <text>详细地址</text>
+        <input
+          placeholder="如楼号/单元/门牌号"
+          type="text"
+          :value="addr"
+          @input="onAddrInput"
+        >
+      </view>
+    </view>
+    <!-- end input列表 -->
+    <!-- 功能按钮 -->
+    <view class="btn-box">
+      <view
+        class="keep btn"
+        @tap="onSaveAddr"
+      >
+        <text>保存收货地址</text>
+      </view>
+
+      <view
+        v-if="addrId!=0"
+        class="clear btn"
+        @tap="onDeleteAddr"
+      >
+        <text>删除收货地址</text>
+      </view>
+    </view>
+    <!-- end 功能按钮 -->
+  </view>
+</template>
+
+<script setup>
+const addrId = ref(0)
+const city = ref('')
+const area = ref('')
+const provinceId = ref(0)
+const cityId = ref(0)
+const areaId = ref(0)
+const receiver = ref('')
+const mobile = ref('')
+const addr = ref('')
+const province = ref('')
+onLoad((options) => {
+  if (options.addrId) {
+    uni.showLoading()
+
+    http.request({
+      url: '/p/address/addrInfo/' + options.addrId,
+      method: 'GET'
+    })
+      .then(({ data }) => {
+        province.value = data.province
+        city.value = data.city
+        area.value = data.area
+        provinceId.value = data.provinceId
+        cityId.value = data.cityId
+        areaId.value = data.areaId
+        receiver.value = data.receiver
+        mobile.value = data.mobile
+        addr.value = data.addr
+        addrId.value = options.addrId
+        initCityData(data.provinceId, data.cityId, data.areaId)
+        uni.hideLoading()
+      })
+  } else {
+    initCityData(provinceId.value, cityId.value, areaId.value)
+  }
+})
+
+const provArray = ref([])
+const valArr = ref([0, 0, 0])
+const initCityData = (provinceId, cityId, areaId) => {
+  uni.showLoading()
+  http.request({
+    url: '/p/area/listByPid',
+    method: 'GET',
+    data: {
+      pid: 0
+    }
+  })
+    .then(({ data }) => {
+      provArray.value = data
+      if (provinceId) {
+        for (const index in data) {
+          if (data[index].areaId === provinceId) {
+            valArr.value = [parseInt(index), valArr.value[1], valArr.value[2]]
+          }
+        }
+      }
+      getCityArray(provinceId || data[0].areaId, cityId, areaId)
+      uni.hideLoading()
+    })
+}
+
+let indexArr = [18, 0, 0]
+const areaArray = ref([])
+const cityArray = ref([])
+/**
+ * 滑动事件
+ */
+const bindChange = (e) => {
+  // 判断滑动的是第几个column
+  const val = e.detail.value
+  // 若省份column做了滑动则定位到地级市和区县第一位
+  if (indexArr[0] != val[0]) {
+    val[1] = 0
+    val[2] = 0 // 更新数据
+    // 获取地级市数据
+    getCityArray(provArray.value[val[0]].areaId)
+  } else {
+    // 若省份column未做滑动，地级市做了滑动则定位区县第一位
+    if (indexArr[1] != val[1]) {
+      val[2] = 0 // 更新数据
+      getAreaArray(cityArray.value[val[1]].areaId) // 获取区县数据
+    }
+  }
+  indexArr = val
+  valArr.value = [val[0], val[1], val[2]]
+  province.value = provArray.value[valArr.value[0]].areaName
+  city.value = cityArray.value[valArr.value[1]].areaName
+  area.value = areaArray.value[valArr.value[2]].areaName
+  provinceId.value = provArray.value[valArr.value[0]].areaId
+  cityId.value = cityArray.value[valArr.value[1]].areaId
+  areaId.value = areaArray.value[valArr.value[2]].areaId
+}
+
+let t = 0
+let moveY = 200
+const show = ref('')
+/**
+ * 移动按钮点击事件
+ */
+const translate = () => {
+  if (t == 0) {
+    moveY = 0
+    show.value = true
+    t = 1
+  } else {
+    moveY = 200
+    show.value = false
+    t = 0
+  }
+  animationEvents(moveY, show.value)
+}
+
+/**
+ * 隐藏弹窗浮层
+ */
+const hiddenFloatView = () => {
+  moveY = 200
+  show.value = false
+  t = 0
+  animationEvents(moveY, show.value)
+}
+
+const animation = ref('')
+/**
+ * 动画事件
+ */
+const animationEvents = (moveY, showParam) => {
+  animation.value = uni.createAnimation({
+    transformOrigin: '50% 50%',
+    duration: 400,
+    timingFunction: 'ease',
+    delay: 0
+  })
+  animation.value.translateY(moveY + 'vh').step()
+  animation.value = animation.value.export()
+  show.value = showParam
+}
+
+/**
+ * 根据省份ID获取 城市数据
+ */
+const getCityArray = (provinceId, cityId, areaId) => {
+  http.request({
+    url: '/p/area/listByPid',
+    method: 'GET',
+    data: {
+      pid: provinceId
+    }
+  })
+    .then(({ data }) => {
+      cityArray.value = data
+      if (cityId) {
+        for (const index in data) {
+          if (data[index].areaId == cityId) {
+            valArr.value = [valArr.value[0], parseInt(index), valArr.value[2]]
+          }
+        }
+      }
+      getAreaArray(cityId || data[0].areaId, areaId)
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 根据城市ID获取 区数据
+ */
+const getAreaArray = (cityId, areaId) => {
+  http.request({
+    url: '/p/area/listByPid',
+    method: 'GET',
+    data: {
+      pid: cityId
+    }
+  }).then(({ data }) => {
+    areaArray.value = data
+    if (areaId) {
+      for (const _index in data) {
+        if (data[_index].areaId == areaId) {
+          valArr.value = [valArr.value[0], valArr.value[1], parseInt(_index)]
+        }
+      }
+      indexArr = valArr.value
+    } else {
+      province.value = provArray.value[valArr.value[0]].areaName
+      city.value = cityArray.value[valArr.value[1]].areaName
+      area.value = areaArray.value[valArr.value[2]].areaName
+      provinceId.value = provArray.value[valArr.value[0]].areaId
+      cityId.value = cityArray.value[valArr.value[1]].areaId
+      areaId.value = areaArray.value[valArr.value[2]].areaId
+    }
+    uni.hideLoading()
+  })
+}
+
+/**
+ * 保存地址
+ */
+const onSaveAddr = () => {
+  const receiverParam = receiver.value
+  const mobileParam = mobile.value
+  const addrParam = addr.value
+
+  if (!receiverParam.trim()) {
+    receiver.value = ''
+    uni.showToast({
+      title: '请输入收货人姓名',
+      icon: 'none'
+    })
+    return
+  }
+
+  if (!mobileParam) {
+    uni.showToast({
+      title: '请输入手机号码',
+      icon: 'none'
+    })
+    return
+  }
+
+  if (mobileParam.length != 11) {
+    uni.showToast({
+      title: '请输入正确的手机号码',
+      icon: 'none'
+    })
+    return
+  }
+
+  if (!addrParam.trim()) {
+    receiver.value = ''
+    uni.showToast({
+      title: '请输入详细地址',
+      icon: 'none'
+    })
+    return
+  }
+
+  uni.showLoading()
+  let url = '/p/address/addAddr'
+  let method = 'POST'
+
+  if (addrId.value != 0) {
+    url = '/p/address/updateAddr'
+    method = 'PUT'
+  } // 添加或修改地址
+
+  http.request({
+    url,
+    method,
+    data: {
+      receiver: receiver.value,
+      mobile: mobile.value,
+      addr: addr.value,
+      province: province.value,
+      provinceId: provinceId.value,
+      city: city.value,
+      cityId: cityId.value,
+      areaId: areaId.value,
+      area: area.value,
+      userType: 0,
+      addrId: addrId.value
+    }
+  })
+    .then(() => {
+      uni.hideLoading()
+      uni.navigateBack({
+        delta: 1
+      })
+    })
+}
+const onReceiverInput = (e) => {
+  receiver.value = e.detail.value
+}
+const onMobileInput = (e) => {
+  mobile.value = e.detail.value
+}
+const onAddrInput = (e) => {
+  addr.value = e.detail.value
+}
+
+/**
+ * 删除配送地址
+ */
+const onDeleteAddr = () => {
+  uni.showModal({
+    title: '',
+    content: '确定要删除此收货地址吗？',
+    confirmColor: '#eb2444',
+
+    success (res) {
+      if (res.confirm) {
+        const addrIdParam = addrId.value
+        uni.showLoading()
+        http.request({
+          url: '/p/address/deleteAddr/' + addrIdParam,
+          method: 'DELETE'
+        })
+          .then(() => {
+            uni.hideLoading()
+            uni.navigateBack({
+              delta: 1
+            })
+          })
+      }
+    }
+  })
+}
+</script>
+
+<style scoped lang="scss">
+@use './editAddress.scss';
+</style>

front-end/mall4uni/src/pages/express-delivery/express-delivery.scss

@@ -0,0 +1,175 @@
+page {
+  background: #f7f8fa;
+}
+.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;
+  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;
+  .companyname {
+    line-height: 1;
+    margin-left: 136rpx;
+    font-size: 28rpx;
+    .key {
+      color: #666;
+    }
+  }
+  .expno {
+    line-height: 1;
+    margin-left: 136rpx;
+    font-size: 28rpx;
+    margin-top: 16rpx;
+    .key {
+      color: #666;
+    }
+  }
+}
+.icon-express {
+  width: 104rpx;
+  height: 104rpx;
+  background-size: 100% 100%;
+  position: absolute;
+  top: 48rpx;
+  left: 30rpx;
+}
+.infoWarp {
+  display: table-cell;
+  vertical-align: middle;
+}
+.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 {
+      color: #105c3e;
+      margin-top: 0;
+    }
+    .time {
+      color: #105c3e;
+    }
+    border-top: 0;
+  }
+}
+.detail {
+  .desc {
+    font-size: 24rpx;
+    line-height: 30rpx;
+    margin-top: 40rpx;
+  }
+  .time {
+    font-size: 24rpx;
+    line-height: 30rpx;
+    color: #999;
+    margin-top: 15rpx;
+    margin-bottom: 39rpx;
+  }
+  border-top: 1px solid #f4f4f4;
+  margin-left: 28rpx;
+  overflow: hidden;
+  padding-right: 30rpx;
+}
+.deliveryTip {
+  height: 80rpx;
+  background-color: #fff8d8;
+  padding-left: 30rpx;
+  color: #f48f18;
+  font-size: 28rpx;
+  line-height: 80rpx;
+  margin-bottom: 20rpx;
+}
+.empty-space {
+  margin-top: 20rpx;
+  background: #fff;
+  font-size: 28rpx;
+  color: #333;
+  padding: 20rpx 0;
+  text-align: center;
+}

front-end/mall4uni/src/pages/express-delivery/express-delivery.vue

@@ -0,0 +1,93 @@
+<template>
+  <!-- 物流信息 -->
+  <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 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
+        v-if="dvyData.length"
+        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 src="@/static/images/icon/dot.png" />
+            </view>
+            <view class="detail">
+              <view class="desc">
+                {{ item.context }}
+              </view>
+              <view class="time">
+                {{ item.time }}
+              </view>
+            </view>
+          </view>
+        </block>
+      </view>
+      <view
+        v-else
+        class="empty-space"
+      >
+        暂无配送信息
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const companyName = ref('')
+const dvyFlowId = ref('')
+const dvyData = ref([])
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  uni.showLoading()
+  http.request({
+    url: '/delivery/check',
+    method: 'GET',
+    data: {
+      orderNumber: options.orderNum
+    }
+  })
+    .then(({ data }) => {
+      companyName.value = data.companyName
+      dvyFlowId.value = data.dvyFlowId
+      dvyData.value = data.data
+      uni.hideLoading()
+    })
+})
+</script>
+
+<style scoped lang="scss">
+@use './express-delivery.scss';
+</style>

front-end/mall4uni/src/pages/index/index.scss

@@ -0,0 +1,410 @@
+.container {
+  background: #f7f7f7;
+  height: auto;
+}
+
+/* 轮播图及搜索框 */
+swiper {
+  width: 100%;
+  height: 350rpx;
+  overflow: hidden;
+}
+swiper.pic-swiper {
+  margin-top: 75rpx;
+  padding: 10rpx 0;
+  background: #fff;
+  height: 422rpx;
+  .img-box {
+    font-size: 0;
+  }
+  .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);
+  }
+}
+swiper-item {
+  font-size: 26rpx;
+  font-weight: bold;
+}
+.wx-swiper-dots {
+  margin-bottom: 15rpx;
+}
+.banner-item {
+  box-sizing: border-box;
+}
+.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;
+    .placeholder {
+      display: block;
+      font-size: 24rpx;
+      color: #999;
+    }
+    .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;
+  .item {
+    text-align: center;
+    width: 25%;
+    display: flex;
+    flex-direction: column;
+    margin: auto;
+    align-items: center;
+    image {
+      width: 75rpx;
+      height: 75rpx;
+    }
+    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;
+  .hornpng {
+    width: 77rpx;
+    height: 36rpx;
+    position: absolute;
+    left: 20rpx;
+    top: 27rpx;
+    margin-right: 8rpx;
+  }
+  .swiper-cont {
+    height: 90rpx;
+    line-height: 90rpx;
+    .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;
+  .more-prod-cont {
+    color: #999;
+    display: inline-block;
+    text-align: right;
+    .more {
+      position: absolute;
+      right: 30rpx;
+      top: 48rpx;
+      color: #666;
+      font-size: 24rpx;
+      padding: 0 20rpx;
+      height: 44rpx;
+      line-height: 44rpx;
+    }
+    .arrow {
+      top: 58rpx;
+      right: 30rpx;
+      border-top: 2rpx solid #666;
+      border-right: 2rpx solid #666;
+    }
+  }
+}
+.up-to-date {
+  .title {
+    color: #fff;
+    background: none;
+    .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;
+      }
+    }
+  }
+  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;
+  .item-cont {
+    margin: auto;
+    height: auto;
+    width: calc(100% - 40rpx);
+    display: flex;
+    flex-wrap: wrap;
+    &::before {
+      clear: both;
+      height: 0;
+      overflow: hidden;
+    }
+    .prod-item {
+      border-radius: 10rpx;
+      width: 220rpx;
+      background: #fff;
+      display: inline-block;
+      margin: 0 8rpx;
+      margin-bottom: 20rpx;
+      box-shadow: 0rpx 6rpx 8rpx rgba(58,134,185,0.2);
+      .imagecont {
+        width: 100%;
+        font-size: 0;
+        .prodimg {
+          width: 220rpx;
+          height: 220rpx;
+          vertical-align: middle;
+          border-top-left-radius: 10rpx;
+          border-top-right-radius: 10rpx;
+          font-size: 0;
+        }
+      }
+      .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;
+      }
+      .prod-price {
+        font-size: 25rpx;
+        color: #eb2444;
+        font-family: Arial;
+        padding: 0 10rpx;
+      }
+    }
+  }
+}
+.hotsale-item-cont {
+  padding-bottom: 20rpx;
+  background: #fff;
+}
+.more.prod-price {
+  position: absolute;
+  bottom: 20rpx;
+}
+
+/* 商城热卖 */
+.hot-sale {
+  .prod-items {
+    width: 345rpx;
+    display: inline-block;
+    background: #fff;
+    padding-bottom: 20rpx;
+    box-sizing: border-box;
+    box-shadow: 0rpx 6rpx 8rpx rgba(58,134,185,0.2);
+    &:nth-child(2n-1) {
+      margin: 20rpx 10rpx 10rpx 20rpx;
+    }
+    &:nth-child(2n) {
+      margin: 20rpx 20rpx 10rpx 10rpx;
+    }
+  }
+}
+.prod-items {
+  .hot-imagecont {
+    .hotsaleimg {
+      width: 341rpx;
+      height: 341rpx;
+    }
+    font-size: 0;
+    text-align: center;
+  }
+  .hot-text {
+    .hotprod-text {
+      font-size: 28rpx;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    margin-top: 20rpx;
+    padding: 0 10rpx;
+    .prod-info {
+      font-size: 22rpx;
+      color: #999;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .prod-text-info {
+      position: relative;
+      height: 70rpx;
+      line-height: 70rpx;
+      font-family: Arial;
+      .hotprod-price {
+        display: inline;
+        font-size: 26rpx;
+        color: #eb2444;
+      }
+      .basket-img {
+        width: 50rpx;
+        height: 50rpx;
+        position: absolute;
+        right: 0;
+        bottom: 7rpx;
+        padding: 8rpx;
+      }
+    }
+  }
+}
+.more-prod {
+  .prod-text-right {
+    .prod-info {
+      font-size: 22rpx;
+      color: #999;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
+}
+.singal-price {
+  display: inline;
+  font-size: 20rpx;
+  text-decoration: line-through;
+  color: #777;
+  margin-left: 15rpx;
+}
+
+/* 更多宝贝 */
+.more-prod {
+  background: #fff;
+  .prod-show {
+    .show-item {
+      .more-prod-pic {
+        width: 250rpx;
+        height: 250rpx;
+        .more-pic {
+          max-width: 100%;
+          max-height: 100%;
+        }
+      }
+      position: relative;
+      display: flex;
+      padding: 20rpx;
+      justify-content: flex-start;
+      border-top: 2rpx solid #f4f4f4;
+      .prod-text-right {
+        margin-left: 30rpx;
+        width: 72%;
+        padding-bottom: 10rpx;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        .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;
+        }
+        .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-price {
+          font-size: 28rpx;
+          font-family: arial;
+        }
+      }
+    }
+  }
+}
+.b-cart {
+  margin-top: 30rpx;
+  .basket-img {
+    width: 50rpx;
+    height: 50rpx;
+    position: absolute;
+    right: 46rpx;
+    padding: 8rpx;
+  }
+}

front-end/mall4uni/src/pages/index/index.vue

@@ -0,0 +1,507 @@
+<template>
+  <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"
+          />
+          <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"
+                class="banner"
+                @tap="toProdPage"
+              />
+            </view>
+          </swiper-item>
+        </block>
+      </swiper>
+      <!-- end swiper -->
+
+      <view class="cat-item">
+        <view
+          class="item"
+          data-sts="1"
+          @tap="toClassifyPage"
+        >
+          <image src="@/static/images/icon/newProd.png" />
+          <text>新品推荐</text>
+        </view>
+        <view
+          class="item"
+          data-sts="1"
+          @tap="toClassifyPage"
+        >
+          <image src="@/static/images/icon/timePrice.png" />
+          <text>限时特惠</text>
+        </view>
+        <view
+          class="item"
+          data-sts="3"
+          @tap="toClassifyPage"
+        >
+          <image src="@/static/images/icon/neweveryday.png" />
+          <text>每日疯抢</text>
+        </view>
+        <view
+          class="item"
+          @tap="toCouponCenter"
+        >
+          <image src="@/static/images/icon/newprods.png" />
+          <text>领优惠券</text>
+        </view>
+      </view>
+
+      <!-- 消息播放 -->
+      <view
+        v-if="news && news.length"
+        class="message-play"
+        @tap="onNewsPage"
+      >
+        <image
+          src="@/static/images/icon/horn.png"
+          class="hornpng"
+        />
+        <swiper
+          :vertical="true"
+          :autoplay="true"
+          :circular="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" />
+      </view>
+    </view>
+
+    <view
+      v-if="updata"
+      class="updata"
+    >
+      <block
+        v-for="(item, index) in taglist"
+        :key="index"
+      >
+        <!-- 每日上新 -->
+        <view
+          v-if="item.style==='2' && item.prods && item.prods.length"
+          class="up-to-date"
+        >
+          <view class="title">
+            <text>{{ item.title }}</text>
+            <view
+              class="more-prod-cont"
+              data-sts="0"
+              :data-id="item.id"
+              :data-title="item.title"
+              @tap="toClassifyPage"
+            >
+              <text class="more">
+                查看更多
+              </text>
+            </view>
+          </view>
+          <view class="item-cont">
+            <block
+              v-for="(prod, index2) in item.prods"
+              :key="index2"
+            >
+              <view
+                class="prod-item"
+                :data-prodid="prod.prodId"
+                @tap="toProdPage"
+              >
+                <view>
+                  <view class="imagecont">
+                    <img-show
+                      :src="prod.pic"
+                      :class-list="['prodimg']"
+                    />
+                  </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
+          v-if="item.style==='1' && item.prods && item.prods.length"
+          class="hot-sale"
+        >
+          <view class="title">
+            <text>{{ item.title }}</text>
+            <view
+              class="more-prod-cont"
+              data-sts="0"
+              :data-id="item.id"
+              :data-title="item.title"
+              @tap="toClassifyPage"
+            >
+              <text class="more">
+                更多
+              </text>
+              <text class="arrow" />
+            </view>
+          </view>
+          <view class="hotsale-item-cont">
+            <block
+              v-for="(prod, index2) in item.prods"
+              :key="index2"
+            >
+              <view
+                class="prod-items"
+                :data-prodid="prod.prodId"
+                @tap="toProdPage"
+              >
+                <view class="hot-imagecont">
+                  <img-show
+                    :src="prod.pic"
+                    :class-list="['hotsaleimg']"
+                  />
+                </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>
+                    <image
+                      src="@/static/images/tabbar/basket-sel.png"
+                      class="basket-img"
+                    />
+                  </view>
+                </view>
+              </view>
+            </block>
+          </view>
+        </view>
+
+        <!-- 更多宝贝 -->
+        <view
+          v-if="item.style==='0' && item.prods && item.prods.length"
+          class="more-prod"
+        >
+          <view class="title">
+            {{ item.title }}
+          </view>
+          <view class="prod-show">
+            <block
+              v-for="(prod, index2) in item.prods"
+              :key="index2"
+            >
+              <view
+                class="show-item"
+                :data-prodid="prod.prodId"
+                @tap="toProdPage"
+              >
+                <view class="more-prod-pic">
+                  <img-show
+                    :src="prod.pic"
+                    :class-list="['more-pic']"
+                  />
+                </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>
+                    <image
+                      src="@/static/images/tabbar/basket-sel.png"
+                      class="basket-img"
+                      @tap.stop="addToCart(prod)"
+                    />
+                  </view>
+                </view>
+              </view>
+            </block>
+          </view>
+        </view>
+      </block>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const wxs = number()
+const indicatorColor = ref('#d1e5fb')
+const indicatorActiveColor = ref('#1b7dec')
+const autoplay = ref(true)
+const interval = ref(2000)
+const duration = ref(1000)
+const indexImgs = ref([])
+const seq = ref(0)
+const news = ref([])
+const taglist = ref([])
+const updata = ref(true)
+
+onLoad(() => {
+  getAllData()
+})
+onShow(() => {
+  // #ifdef MP-WEIXIN
+  uni.getSetting({
+    success (res) {
+      if (!res.authSetting['scope.userInfo']) {
+        uni.navigateTo({
+          url: '/pages/login/login'
+        })
+      }
+    }
+  })
+  // #endif
+  http.getCartCount() // 重新计算购物车总数量
+})
+
+onPullDownRefresh(() => {
+  // 模拟加载
+  setTimeout(() => {
+    getAllData()
+    uni.stopPullDownRefresh() // 停止下拉刷新
+  }, 100)
+})
+
+const getAllData = () => {
+  http.getCartCount()// 重新计算购物车总数量
+  getIndexImgs()
+  getNoticeList()
+  getTag()
+}
+
+const toProdPage = (e) => {
+  const prodid = e.currentTarget.dataset.prodid
+
+  if (prodid) {
+    uni.navigateTo({
+      url: '/pages/prod/prod?prodid=' + prodid
+    })
+  }
+}
+/**
+ * 加入购物车
+ * @param item
+ */
+const addToCart = (item) => {
+  uni.showLoading({
+    mask: true
+  })
+  http.request({
+    url: '/prod/prodInfo',
+    method: 'GET',
+    data: {
+      prodId: item.prodId
+    }
+  })
+    .then(({ data }) => {
+      http.request({
+        url: '/p/shopCart/changeItem',
+        method: 'POST',
+        data: {
+          basketId: 0,
+          count: 1,
+          prodId: data.prodId,
+          shopId: data.shopId,
+          skuId: data.skuList[0].skuId
+        }
+      })
+        .then(() => {
+          uni.hideLoading()
+          http.getCartCount() // 重新计算购物车总数量
+          uni.showToast({
+            title: '加入购物车成功',
+            icon: 'none'
+          })
+        })
+    })
+}
+
+const toCouponCenter = () => {
+  uni.showToast({
+    icon: 'none',
+    title: '该功能未开源'
+  })
+}
+
+/**
+ * 跳转搜索页
+ */
+const toSearchPage = () => {
+  uni.navigateTo({
+    url: '/pages/search-page/search-page'
+  })
+}
+
+/**
+ * 跳转商品活动页面
+ * @param e
+ */
+const toClassifyPage = (e) => {
+  let url = '/pages/prod-classify/prod-classify?sts=' + e.currentTarget.dataset.sts
+  const id = e.currentTarget.dataset.id
+  const title = e.currentTarget.dataset.title
+
+  if (id) {
+    url += '&tagid=' + id + '&title=' + title
+  }
+
+  uni.navigateTo({
+    url
+  })
+}
+/**
+ * 跳转公告列表页面
+ */
+const onNewsPage = () => {
+  uni.navigateTo({
+    url: '/pages/recent-news/recent-news'
+  })
+}
+
+/**
+ * 加载轮播图
+ */
+const getIndexImgs = () => {
+  http.request({
+    url: '/indexImgs',
+    method: 'GET',
+    data: {}
+  })
+    .then(({ data }) => {
+      indexImgs.value = data
+      seq.value = data
+    })
+}
+
+const getNoticeList = () => {
+  // 加载公告
+  http.request({
+    url: '/shop/notice/topNoticeList',
+    method: 'GET',
+    data: {}
+  })
+    .then(({ data }) => {
+      news.value = data
+    })
+}
+
+/**
+ * 加载商品标题分组列表
+ */
+const getTag = () => {
+  http.request({
+    url: '/prod/tag/prodTagList',
+    method: 'GET',
+    data: {}
+  })
+    .then(({ data }) => {
+      taglist.value = data
+      for (let i = 0; i < data.length; i++) {
+        updata.value = false
+        updata.value = true
+        getTagProd(data[i].id, i)
+      }
+    })
+}
+
+const getTagProd = (id, index) => {
+  http.request({
+    url: '/prod/prodListByTagId',
+    method: 'GET',
+    data: {
+      tagId: id,
+      size: 6
+    }
+  })
+    .then(({ data }) => {
+      updata.value = false
+      updata.value = true
+      const taglistParam = taglist.value
+      taglistParam[index].prods = data.records
+      taglist.value = taglistParam
+    })
+}
+</script>
+
+<style scoped lang="scss">
+@use './index.scss';
+</style>

front-end/mall4uni/src/pages/news-detail/news-detail.scss

@@ -0,0 +1,23 @@
+.news-detail {
+  padding: 20rpx;
+  .news-detail-title {
+    font-size: 32rpx;
+    font-weight: bold;
+    line-height: 50rpx;
+    padding: 20rpx;
+  }
+  .news-detail-text {
+    font-size: 28rpx;
+    line-height: 46rpx;
+    text-align: justify;
+    text-justify: inter-ideograph;
+    margin-top: 20rpx;
+  }
+}
+.content {
+  :deep(img) {
+    display: block;
+    width: 100%;
+    height: auto;
+  }
+}

front-end/mall4uni/src/pages/news-detail/news-detail.vue

@@ -0,0 +1,41 @@
+<template>
+  <view class="container">
+    <view class="news-detail">
+      <view class="news-detail-title">
+        {{ news.title }}
+      </view>
+      <rich-text
+        class="content"
+        :nodes="news.content"
+      />
+    </view>
+  </view>
+</template>
+
+<script setup>
+const news = ref({
+  title: '',
+  content: '',
+  id: null
+})
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  // 加载公告详情
+  http.request({
+    url: '/shop/notice/info/' + options.id,
+    method: 'GET'
+  })
+    .then(({ data }) => {
+      data.content = data.content.replace(/width=/gi, 'sss=')
+      data.content = data.content.replace(/height=/gi, 'sss=')
+      data.content = data.content.replace(/ \/>/gi, ' style="max-width:100% !important;display:block;" />')
+      news.value = data
+    })
+})
+</script>
+
+<style scoped lang="scss">
+@use './news-detail.scss';
+</style>

front-end/mall4uni/src/pages/order-detail/order-detail.scss

@@ -0,0 +1,247 @@
+.container {
+  background: #f4f4f4;
+}
+.order-detail {
+  margin-bottom: 120rpx;
+  padding-bottom: 160rpx;
+  .delivery-addr {
+    padding: 20rpx 30rpx;
+    background: #fff;
+    .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;
+      .item {
+        font-size: 28rpx;
+        margin-right: 30rpx;
+        vertical-align: top;
+        display: inline-block;
+      }
+    }
+    .addr {
+      font-size: 26rpx;
+      line-height: 36rpx;
+      color: #999;
+      word-wrap: break-word;
+    }
+  }
+}
+.prod-item {
+  background-color: #fff;
+  margin-top: 15rpx;
+  font-size: 28rpx;
+  .item-cont {
+    .prod-pic {
+      image {
+        width: 180rpx;
+        height: 180rpx;
+        width: 100%;
+        height: 100%;
+      }
+      font-size: 0;
+      display: block;
+      width: 160rpx;
+      height: 160rpx;
+      overflow: hidden;
+      background: #fff;
+      margin-right: 16rpx;
+    }
+    display: flex;
+    align-items: center;
+    padding: 30rpx;
+    border-top: 2rpx solid #f1f1f1;
+    .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;
+      .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-info-cont {
+        position: relative;
+        color: #999;
+        margin-top: 10rpx;
+        font-size: 24rpx;
+        .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%;
+        }
+        .number {
+          float: left;
+          margin-right: 20rpx;
+        }
+      }
+    }
+  }
+  .price-nums {
+    margin-top: 30rpx;
+    .prodprice {
+      color: #333;
+      height: 50rpx;
+      line-height: 50rpx;
+      font-size: 24rpx;
+      float: left;
+    }
+    .btn-box {
+      float: right;
+      text-align: right;
+      .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;
+  .msg-item {
+    padding: 20rpx;
+    border-top: 2rpx solid #f1f1f1;
+    &:first-child {
+      border: 0;
+    }
+    .item {
+      display: flex;
+      padding: 10rpx 0;
+      align-items: center;
+      box-sizing: border-box;
+      .item-tit {
+        min-width: 140rpx;
+        color: #999;
+        line-height: 48rpx;
+      }
+      .item-txt {
+        flex: 1;
+        line-height: 48rpx;
+      }
+      .item-txt.remarks {
+        max-width: 600rpx;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      .copy-btn {
+        display: block;
+        margin-left: 20rpx;
+        border: 2rpx solid #e4e4e4;
+        padding: 6rpx 24rpx;
+        border-radius: 50rpx;
+        font-size: 24rpx;
+        line-height: 28rpx;
+      }
+      .item-txt.price {
+        text-align: right;
+      }
+    }
+    .item.payment {
+      border-top: 2rpx solid #f1f1f1;
+      color: #eb2444;
+      padding-top: 30rpx;
+    }
+  }
+}
+.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);
+  .dele-order {
+    margin-left: 20rpx;
+    line-height: 60rpx;
+    display: block;
+    margin-right: 20rpx;
+    width: 150rpx;
+    text-align: center;
+  }
+  .footer-box {
+    flex: 1;
+    text-align: right;
+    line-height: 60rpx;
+    .buy-again {
+      font-size: 26rpx;
+      color: #fff;
+      background: #eb2444;
+      border-radius: 50rpx;
+      padding: 10rpx 20rpx;
+      margin-right: 20rpx;
+    }
+    .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-sts {
+    color: #eb2444;
+    font-size: 28rpx;
+  }
+  .order-sts.gray {
+    color: #999;
+    height: 32rpx;
+    line-height: 32rpx;
+  }
+  .order-sts.normal {
+    color: #333;
+  }
+}

front-end/mall4uni/src/pages/order-detail/order-detail.vue

@@ -0,0 +1,299 @@
+<template>
+  <view class="container">
+    <view class="order-detail">
+      <view
+        v-if="userAddrDto"
+        class="delivery-addr"
+      >
+        <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
+        v-if="orderItemDtos"
+        class="prod-item"
+      >
+        <block
+          v-for="(item, index) in orderItemDtos"
+          :key="index"
+        >
+          <view
+            class="item-cont"
+            :data-prodid="item.prodId"
+            @tap="toProdPage"
+          >
+            <view class="prod-pic">
+              <image :src="item.pic" />
+            </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" />
+              </view>
+            </view>
+          </view>
+        </block>
+      </view>
+
+      <!-- 订单信息 -->
+      <view class="order-msg">
+        <view class="msg-item">
+          <view class="item">
+            <text class="item-tit">
+              订单编号：
+            </text>
+            <text class="item-txt">
+              {{ orderNumber }}
+            </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
+              v-if="!!remarks"
+              class="item-tit"
+            >
+              订单备注：
+            </text>
+            <text class="item-txt remarks">
+              {{ 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(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(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
+        v-if="status==5||status==6"
+        class="order-detail-footer"
+      >
+        <text
+          v-if="status==5||status==6"
+          class="dele-order"
+          @tap="delOrderList"
+        >
+          删除订单
+        </text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const wxs = number()
+
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  loadOrderDetail(options.orderNum)
+})
+
+/**
+ * 跳转商品详情页
+ * @param e
+ */
+const toProdPage = (e) => {
+  const prodid = e.currentTarget.dataset.prodid
+  uni.navigateTo({
+    url: '/pages/prod/prod?prodid=' + prodid
+  })
+}
+
+const remarks = ref('')
+const orderItemDtos = ref([])
+const reduceAmount = ref('')
+const transfee = ref('')
+const status = ref(0)
+const actualTotal = ref(0)
+const userAddrDto = ref(null)
+const orderNumber = ref('')
+const createTime = ref('')
+const total = ref(0) // 商品总额
+/**
+ * 加载订单数据
+ */
+const loadOrderDetail = (orderNum) => {
+  uni.showLoading() // 加载订单详情
+  http.request({
+    url: '/p/myOrder/orderDetail',
+    method: 'GET',
+    data: {
+      orderNumber: orderNum
+    }
+  })
+    .then(({ data }) => {
+      orderNumber.value = orderNum
+      actualTotal.value = data.actualTotal
+      userAddrDto.value = data.userAddrDto
+      remarks.value = data.remarks
+      orderItemDtos.value = data.orderItemDtos
+      createTime.value = data.createTime
+      status.value = data.status
+      transfee.value = data.transfee
+      reduceAmount.value = data.reduceAmount
+      total.value = data.total
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 删除已完成||已取消的订单
+ */
+const delOrderList = () => {
+  uni.showModal({
+    title: '',
+    content: '确定要删除此订单吗？',
+    confirmColor: '#eb2444',
+    success (res) {
+      if (res.confirm) {
+        uni.showLoading()
+        http.request({
+          url: '/p/myOrder/' + orderNumber.value,
+          method: 'DELETE'
+        })
+          .then(() => {
+            uni.hideLoading()
+            uni.showToast({
+              title: res || '删除成功',
+              icon: 'none'
+            })
+            setTimeout(() => {
+              uni.redirectTo({
+                url: '/pages/orderList/orderList'
+              })
+            }, 1000)
+          })
+      }
+    }
+  })
+}
+</script>
+
+<style scoped lang="scss">
+@use './order-detail.scss';
+</style>

front-end/mall4uni/src/pages/orderList/orderList.scss

@@ -0,0 +1,211 @@
+.container {
+  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;
+  text {
+    display: block;
+    font-size: 28rpx;
+    color: 999;
+    width: 100rpx;
+    text-align: center;
+  }
+  text.on {
+    border-bottom: 4rpx solid #eb2444;
+    color: #eb2444;
+  }
+}
+.main {
+  margin-top: 100rpx;
+}
+.prod-item {
+  background-color: #fff;
+  margin-top: 15rpx;
+  font-size: 28rpx;
+  .item-cont {
+    .prod-pic {
+      image {
+        width: 180rpx;
+        height: 180rpx;
+        width: 100%;
+        height: 100%;
+      }
+      font-size: 0;
+      display: inline-block;
+      width: 160rpx;
+      height: 160rpx;
+      overflow: hidden;
+      background: #fff;
+      margin-right: 16rpx;
+    }
+    .categories {
+      white-space: nowrap;
+    }
+    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-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;
+      .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-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;
+      }
+    }
+  }
+  .order-num {
+    padding: 20rpx 30rpx;
+    display: flex;
+    justify-content: space-between;
+    font-size: 28rpx;
+    .clear-btn {
+      width: 32rpx;
+      height: 32rpx;
+      font-size: 0;
+      vertical-align: top;
+      margin-left: 42rpx;
+      position: relative;
+      &::after {
+        content: " ";
+        display: block;
+        position: absolute;
+        left: -10px;
+        top: 0rpx;
+        width: 1px;
+        height: 32rpx;
+        background: #ddd;
+      }
+      .clear-list-btn {
+        width: 100%;
+        height: 100%;
+        vertical-align: middle;
+      }
+    }
+  }
+  .total-num {
+    text-align: right;
+    padding: 20rpx 30rpx;
+    font-size: 28rpx;
+    .prodprice {
+      display: inline-block;
+      color: #333;
+    }
+    .prodcount {
+      margin-right: 20rpx;
+    }
+  }
+  .price-nums {
+    .prodprice {
+      color: #333;
+      position: absolute;
+      bottom: 0;
+    }
+    .prodcount {
+      position: absolute;
+      bottom: 5rpx;
+      right: 0;
+      color: #999;
+      font-family: verdana;
+    }
+  }
+  .prod-foot {
+    border-top: 2rpx solid #e6e6e6;
+    .total {
+      font-size: 25rpx;
+      margin-bottom: 20rpx;
+      padding-bottom: 20rpx;
+      border-bottom: 2rpx solid #e9eaec;
+    }
+    .btn {
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+    }
+  }
+}
+.order-state {
+  display: flex;
+  align-items: center;
+  font-size: 24rpx;
+  .order-sts.red {
+    color: #eb2444;
+  }
+  .order-sts.gray {
+    color: #999;
+  }
+}
+.other-button-hover {
+  background-color: blue;
+}
+.button-hover {
+  background-color: red;
+  background-color: blue;
+}
+.button {
+  margin-top: 20rpx;
+  margin-bottom: 20rpx;
+  margin-left: 10px;
+  font-size: 26rpx;
+  background: #fff;
+  padding: 10rpx 30rpx;
+  border-radius: 80rpx;
+  border: 2rpx solid #e1e1e1;
+  &:last-child {
+    margin-right: 10rpx;
+  }
+}
+.button.warn {
+  color: #eb2444;
+  border-color: #eb2444;
+}
+.empty {
+  font-size: 24rpx;
+  margin-top: 100rpx;
+  text-align: center;
+  color: #999;
+  height: 300rpx;
+  line-height: 300rpx;
+}

front-end/mall4uni/src/pages/orderList/orderList.vue

@@ -0,0 +1,424 @@
+<template>
+  <view class="container">
+    <!-- 头部菜单 -->
+    <view class="order-tit">
+      <text
+        data-sts="0"
+        :class="sts==0?'on':''"
+        @tap="onStsTap"
+      >
+        全部
+      </text>
+      <text
+        data-sts="1"
+        :class="sts==1?'on':''"
+        @tap="onStsTap"
+      >
+        待支付
+      </text>
+      <text
+        data-sts="2"
+        :class="sts==2?'on':''"
+        @tap="onStsTap"
+      >
+        待发货
+      </text>
+      <text
+        data-sts="3"
+        :class="sts==3?'on':''"
+        @tap="onStsTap"
+      >
+        待收货
+      </text>
+      <text
+        data-sts="5"
+        :class="sts==5?'on':''"
+        @tap="onStsTap"
+      >
+        已完成
+      </text>
+    </view>
+    <!-- end 头部菜单 -->
+    <view class="main">
+      <view
+        v-if="list.length==0"
+        class="empty"
+      >
+        还没有任何相关订单
+      </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
+                v-if="item.status==5 || item.status==6"
+                class="clear-btn"
+              >
+                <image
+                  src="@/static/images/icon/clear-his.png"
+                  class="clear-list-btn"
+                  :data-ordernum="item.orderNumber"
+                  @tap="delOrderList"
+                />
+              </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"
+                  :data-ordernum="item.orderNumber"
+                  @tap="toOrderDetailPage"
+                >
+                  <view class="prod-pic">
+                    <image :src="prod.pic" />
+                  </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"
+              :data-ordernum="item.orderNumber"
+              @tap="toOrderDetailPage"
+            >
+              <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" />
+                  </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"
+                :data-ordernum="item.orderNumber"
+                hover-class="none"
+                @tap="onCancelOrder"
+              >
+                取消订单
+              </text>
+              <text
+                v-if="item.status==1"
+                class="button warn"
+                :data-ordernum="item.orderNumber"
+                hover-class="none"
+                @tap="normalPay"
+              >
+                付款
+              </text>
+              <text
+                v-if="item.status==3 || item.status==5"
+                class="button"
+                :data-ordernum="item.orderNumber"
+                hover-class="none"
+                @tap="toDeliveryPage"
+              >
+                查看物流
+              </text>
+              <text
+                v-if="item.status==3"
+                class="button warn"
+                :data-ordernum="item.orderNumber"
+                hover-class="none"
+                @tap="onConfirmReceive"
+              >
+                确认收货
+              </text>
+            </view>
+          </view>
+        </view>
+      </block>
+    </view>
+  </view>
+  <!-- end 订单列表 -->
+</template>
+
+<script setup>
+const wxs = number()
+
+const sts = ref(0)
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  if (options.sts) {
+    sts.value = options.sts
+    loadOrderData(options.sts, 1)
+  } else {
+    loadOrderData(0, 1)
+  }
+})
+
+const current = ref(1)
+const pages = ref(0)
+/**
+ * 页面上拉触底事件的处理函数
+ */
+onReachBottom(() => {
+  if (current.value < pages.value) {
+    loadOrderData(sts.value, current.value + 1)
+  }
+})
+
+const list = ref([])
+/**
+ * 加载订单数据
+ */
+const loadOrderData = (sts, currentParam) => {
+  uni.showLoading() // 加载订单列表
+  http.request({
+    url: '/p/myOrder/myOrder',
+    method: 'GET',
+    data: {
+      current: currentParam,
+      size: 10,
+      status: sts
+    }
+  })
+    .then(({ data }) => {
+      let listParam = []
+      if (data.current === 1) {
+        listParam = data.records
+      } else {
+        listParam = list.value
+        Array.prototype.push.apply(listParam, data.records)
+      }
+      list.value = listParam
+      pages.value = data.pages
+      current.value = data.current
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 状态点击事件
+ */
+const onStsTap = (e) => {
+  sts.value = e.currentTarget.dataset.sts
+  loadOrderData(sts.value, 1)
+}
+
+/**
+ * 查看物流
+ */
+const toDeliveryPage = (e) => {
+  uni.navigateTo({
+    url: '/pages/express-delivery/express-delivery?orderNum=' + e.currentTarget.dataset.ordernum
+  })
+}
+
+/**
+ * 取消订单
+ */
+const onCancelOrder = (e) => {
+  const ordernum = e.currentTarget.dataset.ordernum
+  uni.showModal({
+    title: '',
+    content: '要取消此订单？',
+    confirmColor: '#3e62ad',
+    cancelColor: '#3e62ad',
+    cancelText: '否',
+    confirmText: '是',
+
+    success (res) {
+      if (res.confirm) {
+        uni.showLoading({
+          mask: true
+        })
+        http.request({
+          url: '/p/myOrder/cancel/' + ordernum,
+          method: 'PUT',
+          data: {}
+        })
+          .then(() => {
+            loadOrderData(sts.value, 1)
+            uni.hideLoading()
+          })
+      }
+    }
+  })
+}
+
+/**
+ * 模拟支付，直接提交成功
+ * @param e
+ */
+const normalPay = (e) => {
+  uni.showLoading({
+    mask: true
+  })
+  http.request({
+    url: '/p/order/normalPay',
+    method: 'POST',
+    data: {
+      orderNumbers: e.currentTarget.dataset.ordernum
+    }
+  })
+    .then(({ data }) => {
+      uni.hideLoading()
+      if (data) {
+        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'
+        })
+      }
+    })
+}
+
+/**
+ * 查看订单详情
+ */
+const toOrderDetailPage = (e) => {
+  uni.navigateTo({
+    url: '/pages/order-detail/order-detail?orderNum=' + e.currentTarget.dataset.ordernum
+  })
+}
+
+/**
+ * 确认收货
+ */
+const onConfirmReceive = (e) => {
+  uni.showModal({
+    title: '',
+    content: '我已收到货？',
+    confirmColor: '#eb2444',
+
+    success (res) {
+      if (res.confirm) {
+        uni.showLoading({
+          mask: true
+        })
+        http.request({
+          url: '/p/myOrder/receipt/' + e.currentTarget.dataset.ordernum,
+          method: 'PUT'
+        })
+          .then(() => {
+            loadOrderData(sts.value, 1)
+            uni.hideLoading()
+          })
+      }
+    }
+  })
+}
+
+/**
+ * 删除已完成||已取消的订单
+ * @param e
+ */
+const delOrderList = (e) => {
+  uni.showModal({
+    title: '',
+    content: '确定要删除此订单吗？',
+    confirmColor: '#eb2444',
+
+    success (res) {
+      if (res.confirm) {
+        const ordernum = e.currentTarget.dataset.ordernum
+        uni.showLoading()
+
+        http.request({
+          url: '/p/myOrder/' + ordernum,
+          method: 'DELETE'
+        })
+          .then(() => {
+            loadOrderData(sts.value, 1)
+            uni.hideLoading()
+          })
+      }
+    }
+  })
+}
+
+</script>
+
+<style scoped lang="scss">
+@use './orderList.scss';
+</style>

front-end/mall4uni/src/pages/pay-result/pay-result.scss

@@ -0,0 +1,50 @@
+.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;
+  .button {
+    border-radius: 10rpx;
+    font-size: 28rpx;
+    background: #fff;
+    color: #333;
+    padding: 20rpx 35rpx;
+    width: 300rpx;
+    margin: 0 20rpx;
+    text-align: center;
+  }
+  .button.checkorder {
+    background: #19be6b;
+    color: #fff;
+    margin-bottom: 20rpx;
+    border: 2rpx solid #19be6b;
+  }
+  .button.payagain {
+    background: #fff;
+    border: 2rpx solid #f90;
+    color: #f90;
+  }
+  .button.shopcontinue {
+    background: #fff;
+    border: 2rpx solid #19be6b;
+    color: #19be6b;
+  }
+}
+.tips {
+  font-size: 28rpx;
+  color: #999;
+  text-align: center;
+  .warn {
+    color: #f43530;
+  }
+}

front-end/mall4uni/src/pages/pay-result/pay-result.vue

@@ -0,0 +1,110 @@
+<template>
+  <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 setup>
+const sts = ref(0)
+const orderNumbers = ref('')
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  sts.value = options.sts
+  orderNumbers.value = options.orderNumbers
+})
+
+const toOrderList = () => {
+  uni.navigateTo({
+    url: '/pages/orderList/orderList?sts=0'
+  })
+}
+const toIndex = () => {
+  uni.switchTab({
+    url: '/pages/index/index'
+  })
+}
+const payAgain = () => {
+  uni.showLoading({
+    mask: true
+  })
+  http.request({
+    url: '/p/order/pay',
+    method: 'POST',
+    data: {
+      payType: 1,
+      orderNumbers: orderNumbers.value
+    }
+  })
+    .then(({ data }) => {
+      uni.hideLoading()
+      uni.requestPayment({
+        timeStamp: data.timeStamp,
+        nonceStr: data.nonceStr,
+        package: data.packageValue,
+        signType: data.signType,
+        paySign: data.paySign,
+        success: () => {
+          uni.redirectTo({
+            url: '/pages/pay-result/pay-result?sts=1&orderNum=' + orderNumbers.value
+          })
+        }
+      })
+    })
+}
+</script>
+
+<style scoped lang="scss">
+@use './pay-result.scss';
+</style>

front-end/mall4uni/src/pages/prod-classify/prod-classify.scss

@@ -0,0 +1,30 @@
+.container {
+  background: #fff;
+  margin: 7px;
+}
+.line-fix {
+  width: 100%;
+  height: 2rpx;
+  background: #e1e1e1;
+  position: fixed;
+  top: 0;
+}
+.tit-background {
+  width: 100%;
+  height: 20rpx;
+  background: #f4f4f4;
+}
+.prod-list {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
+/* 空 */
+.empty {
+  display: block;
+  width: 100%;
+  font-size: 26rpx;
+  color: #999;
+  margin-top: 20vh;
+  text-align: center;
+}

front-end/mall4uni/src/pages/prod-classify/prod-classify.vue

@@ -0,0 +1,232 @@
+<template>
+  <view class="container">
+    <view>
+      <block
+        v-for="(item, index) in prodList"
+        :key="index"
+      >
+        <production :item="item" />
+      </block>
+      <view
+        v-if="!prodList.length"
+        class="empty"
+      >
+        暂无数据
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const sts = ref(0)
+const title = ref('')
+const current = ref(1)
+const size = ref(10)
+const pages = ref(0)
+const tagid = ref(0)
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  current.value = 1
+  pages.value = 0
+  sts.value = options.sts
+  title.value = options.title ? options.title : ''
+
+  if (options.tagid) {
+    tagid.value = options.tagid
+  }
+
+  if (sts.value == 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 (sts.value == 1) {
+    uni.setNavigationBarTitle({
+      title: '新品推荐'
+    })
+  } else if (sts.value == 2) {
+    uni.setNavigationBarTitle({
+      title: '限时特惠'
+    })
+  } else if (sts.value == 3) {
+    uni.setNavigationBarTitle({
+      title: '每日疯抢'
+    })
+  } else if (sts.value == 4) {
+    uni.setNavigationBarTitle({
+      title: '优惠券活动商品'
+    })
+  } else if (sts.value == 5) {
+    uni.setNavigationBarTitle({
+      title: '我的收藏商品'
+    })
+  } else {
+    uni.setNavigationBarTitle({
+      title: title.value
+    })
+  }
+
+  loadProdData(options)
+})
+
+/**
+ * 页面上拉触底事件的处理函数
+ */
+onReachBottom(() => {
+  if (current.value < pages.value) {
+    current.value = current.value + 1
+    loadProdData()
+  }
+})
+
+/**
+ * 加载商品数据
+ */
+const loadProdData = (options) => {
+  const stsParam = sts.value
+
+  if (stsParam == 0) {
+    // 分组标签商品列表
+    getTagProd()
+  } else if (stsParam == 1) {
+    // 新品推荐
+    const url = '/prod/lastedProdPage'
+    getActProd(url)
+  } else if (stsParam == 2) {
+    // 限时特惠
+    const url = '/prod/discountProdList'
+    getActProd(url)
+  } else if (stsParam == 3) {
+    // 每日疯抢
+    const url = '/prod/moreBuyProdList'
+    getActProd(url)
+  } else if (stsParam == 4) {
+    // 优惠券商品列表
+    getProdByCouponId(options.tagid)
+  } else if (stsParam == 5) {
+    // 收藏商品列表
+    getCollectionProd()
+  }
+}
+
+const prodList = ref([])
+const getActProd = (url) => {
+  uni.showLoading()
+  http.request({
+    url,
+    method: 'GET',
+    data: {
+      current: current.value,
+      size: size.value
+    }
+  })
+    .then(({ data }) => {
+      let list
+      if (data.current === 1) {
+        list = data.records
+      } else {
+        list = prodList.value
+        list = list.concat(data.records)
+      }
+      prodList.value = list
+      pages.value = data.pages
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 获取我的收藏商品
+ */
+const getCollectionProd = () => {
+  uni.showLoading()
+  http.request({
+    url: '/p/user/collection/prods',
+    method: 'GET',
+    data: {
+      current: current.value,
+      size: size.value
+    }
+  })
+    .then(({ data }) => {
+      let list
+      if (data.current == 1) {
+        list = data.records
+      } else {
+        list = prodList.value
+        list = list.concat(data.records)
+      }
+      prodList.value = list
+      pages.value = data.pages
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 获取标签列表
+ */
+const getTagProd = () => {
+  uni.showLoading()
+  http.request({
+    url: '/prod/prodListByTagId',
+    method: 'GET',
+    data: {
+      tagId: tagid.value,
+      current: current.value,
+      size: size.value
+    }
+  })
+    .then(({ data }) => {
+      let list
+      if (data.current === 1) {
+        list = data.records
+      } else {
+        list = prodList.value.concat(data.records)
+      }
+      prodList.value = list
+      pages.value = data.pages
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 获取优惠券商品列表
+ */
+const getProdByCouponId = (id) => {
+  uni.showLoading()
+  http.request({
+    url: '/coupon/prodListByCouponId',
+    method: 'GET',
+    data: {
+      couponId: id,
+      current: current.value,
+      size: size.value
+    }
+  })
+    .then(({ data }) => {
+      let list
+      if (data.current === 1) {
+        list = data.records
+      } else {
+        list = prodList.value.concat(data.records)
+      }
+      prodList.value = list
+      pages.value = data.pages
+      uni.hideLoading()
+    })
+}
+</script>
+
+<style scoped lang="scss">
+@use './prod-classify.scss';
+</style>

front-end/mall4uni/src/pages/prod/prod.scss

@@ -0,0 +1,628 @@
+.container {
+  background: #f4f4f4;
+  height: 100%;
+  padding-bottom: 150rpx;
+}
+swiper {
+  height: 750rpx;
+  width: 100%;
+  border-bottom: 2rpx solid #f8f8f8;
+  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;
+  .col {
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 80rpx;
+    color: #666;
+    font-size: 20rpx;
+    padding-left: 20rpx;
+    text-align: center;
+    image {
+      display: block;
+      margin: auto;
+      width: 40rpx;
+      height: 40rpx;
+    }
+    &::after {
+      content: "";
+      display: block;
+      width: 1px;
+      height: auto;
+      background: #f1f1f1;
+      position: absolute;
+      top: 0;
+      bottom: 5px;
+      left: 0;
+    }
+  }
+}
+.prod-tit {
+  font-size: 32rpx;
+  color: #333;
+  padding-right: 20rpx;
+}
+.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: 30rpx;
+}
+.price-num {
+  font-size: 46rpx;
+  font-weight: 400;
+}
+.ori-price {
+  font-size: 25rpx;
+  color: #999;
+  text-decoration: line-through;
+}
+.sales {
+  color: #999;
+}
+.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;
+  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;
+  }
+  text.selected {
+    color: #fff;
+    background: #e93b3d;
+  }
+}
+.cmt-item {
+  position: relative;
+  padding: 10px 0;
+  &::after {
+    content: "";
+    height: 0;
+    display: block;
+    border-bottom: 1px solid #ddd;
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    right: -10px;
+    border-bottom-color: #e5e5e5;
+  }
+}
+.cmt-items {
+  .empty {
+    display: block;
+    font-size: 24rpx;
+    text-align: center;
+    color: #aaa;
+    margin-top: 5vh;
+  }
+}
+.cmt-user {
+  line-height: 25px;
+  margin-bottom: 8px;
+  font-size: 12px;
+  .user-img {
+    width: 25px;
+    height: 25px;
+    border-radius: 50%;
+    vertical-align: middle;
+  }
+  .nickname {
+    margin-left: 10px;
+    display: inline-block;
+    color: #333;
+    max-width: 8.2em;
+    height: 25px;
+    line-height: 27px;
+  }
+  .date {
+    float: right;
+    color: #999;
+    margin-left: -60px;
+  }
+}
+.cmt-user-info {
+  display: flex;
+  align-items: center;
+  width: 400rpx;
+}
+.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;
+  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;
+  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-cont {
+    height: calc(100% - 80rpx);
+    overflow: auto;
+  }
+  .cmt-cnt {
+    -webkit-line-clamp: 20;
+    max-height: 500px;
+  }
+  .load-more {
+    font-size: 14px;
+    padding: 20px;
+    text-align: center;
+    margin-bottom: 10px;
+    text {
+      border: 1px solid #ddd;
+      padding: 5px 10px;
+      border-radius: 10px;
+      color: #666;
+    }
+  }
+}
+.cmt-reply {
+  font-size: 14px;
+  border-top: 1px dashed #ddd;
+  padding: 5px 0;
+  .reply-tit {
+    color: #eb2444;
+  }
+}
+.prod-detail {
+  background: #fff;
+  margin-top: 20rpx;
+  position: relative;
+  line-height: 48rpx;
+  image {
+    width: 750rpx !important;
+    display: block;
+  }
+}
+rich-text {
+  image {
+    width: 100% !important;
+  }
+}
+:deep(.img) {
+  width: 100% !important;
+  display: block;
+}
+.cart-footer {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  display: flex;
+  flex-flow: row nowrap;
+  height: 98rpx;
+  z-index: 999;
+  box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05);
+  .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;
+    .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;
+    }
+    .badge-1 {
+      width: 36rpx;
+    }
+  }
+  .btn.icon {
+    flex-grow: 0;
+    flex-shrink: 0;
+    width: 125rpx;
+    font-size: 20rpx;
+    color: #666;
+    image {
+      width: 50rpx;
+      height: 50rpx;
+    }
+  }
+  .btn.cart {
+    background: #584e61;
+    color: #fff;
+  }
+  .btn.buy {
+    background: #eb2444;
+    color: #fff;
+  }
+}
+.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;
+  &::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;
+  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;
+  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;
+  }
+  .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;
+  .count-name {
+    color: #999;
+    height: 31px;
+    line-height: 31px;
+    width: 100rpx;
+  }
+  .num-wrap {
+    position: relative;
+    z-index: 0;
+    width: 110px;
+    float: right;
+    vertical-align: middle;
+    display: flex;
+  }
+  .text-wrap {
+    position: relative;
+    width: 45px;
+    z-index: 0;
+    margin: 0 1px;
+    input {
+      height: 30px;
+      width: 100%;
+      color: #333;
+      background: #fff;
+      font-size: 12px;
+      text-align: center;
+      border: none;
+      background: #f7f7f7;
+    }
+  }
+}
+.num-wrap {
+  .minus {
+    position: relative;
+    max-width: 30px;
+    min-width: 30px;
+    height: 30px;
+    line-height: 30px;
+    background: #f7f7f7;
+    text-align: center;
+    border-top-left-radius: 3px;
+    border-bottom-left-radius: 3px;
+  }
+  .plus {
+    position: relative;
+    max-width: 30px;
+    min-width: 30px;
+    height: 30px;
+    line-height: 30px;
+    background: #f7f7f7;
+    text-align: center;
+    border-top-right-radius: 3px;
+    border-bottom-right-radius: 3px;
+  }
+  .row {
+    border-radius: 20px;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin-left: -7px;
+    margin-top: -1px;
+    width: 14px;
+    height: 2px;
+    background-color: #ccc;
+  }
+  .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-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);
+  .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;
+  }
+  .btn.cart {
+    background: #584e61;
+    color: #fff;
+  }
+  .btn.buy {
+    background: #eb2444;
+    color: #fff;
+  }
+}

front-end/mall4uni/src/pages/prod/prod.vue

@@ -0,0 +1,875 @@
+<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" />
+        </swiper-item>
+      </block>
+    </swiper>
+    <!-- end  轮播图 -->
+    <!-- 商品信息 -->
+    <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
+            v-if="isCollection"
+            src="@/static/images/icon/prod-col-red.png"
+          />
+          收藏
+        </view>
+      </view>
+      <view class="sales-p">
+        {{ brief }}
+      </view>
+      <view class="prod-price">
+        <text
+          v-if="defaultSku && defaultSku.price"
+          class="price"
+        >
+          ￥
+          <text class="price-num">
+            {{ wxs.parsePrice(defaultSku.price)[0] }}
+          </text>
+          .{{ wxs.parsePrice(defaultSku.price)[1] }}
+        </text>
+        <text
+          v-if="defaultSku && defaultSku.oriPrice"
+          class="ori-price"
+        >
+          ￥{{ wxs.parsePrice(defaultSku.oriPrice)[0] }}.{{ wxs.parsePrice(defaultSku.oriPrice)[1] }}
+        </text>
+        <text class="sales" />
+      </view>
+    </view>
+    <!-- 已选规格 -->
+    <view
+      class="sku"
+      @tap="showSku"
+    >
+      <view class="sku-tit">
+        已选
+      </view>
+      <view class="sku-con">
+        {{ selectedProp.length > 0 ? 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" />
+        </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"
+                />
+                <view class="nickname">
+                  {{ item.nickName }}
+                </view>
+              </view>
+            </view>
+            <view class="cmt-cnt">
+              {{ item.content }}
+            </view>
+            <scroll-view
+              v-if="item.pics.length"
+              class="cmt-attr"
+              scroll-x="true"
+            >
+              <image
+                v-for="(commPic, index2) in item.pics"
+                :key="index2"
+                :src="commPic"
+              />
+            </scroll-view>
+          </view>
+        </view>
+        <view
+          v-if="prodCommPage.records.length > 2"
+          class="cmt-more-v"
+        >
+          <text @tap="showComment">
+            查看全部评价
+          </text>
+        </view>
+      </view>
+    </view>
+    <!-- 商品详情 -->
+    <view class="prod-detail">
+      <view>
+        <rich-text :nodes="content" />
+      </view>
+    </view>
+    <!-- end 商品详情 -->
+
+    <!-- 底部按钮 -->
+    <view class="cart-footer">
+      <view
+        class="btn icon"
+        @tap="toHomePage"
+      >
+        <image src="@/static/images/tabbar/homepage.png" />
+        首页
+      </view>
+      <view
+        class="btn icon"
+        @tap="toCartPage"
+      >
+        <image src="@/static/images/tabbar/basket.png" />
+        购物车
+        <view
+          v-if="totalCartNum>0"
+          class="badge badge-1"
+        >
+          {{ totalCartNum }}
+        </view>
+      </view>
+      <view
+        class="btn cart"
+        @tap="showSku"
+      >
+        <text>加入购物车</text>
+      </view>
+      <view
+        class="btn buy"
+        @tap="showSku"
+      >
+        <text>立即购买</text>
+      </view>
+    </view>
+    <!-- end 底部按钮 -->
+
+    <!-- 规格弹窗 -->
+    <view
+      v-if="skuShow"
+      class="pup-sku"
+    >
+      <view class="pup-sku-main">
+        <view class="pup-sku-header">
+          <image
+            class="pup-sku-img"
+            :src="defaultSku.pic?defaultSku.pic:pic"
+          />
+          <view class="pup-sku-price">
+            ￥
+            <text
+              v-if="defaultSku && defaultSku.price"
+              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 + '，' : '' }}{{ prodNum }}件
+          </view>
+          <view
+            class="close"
+            @tap="closePopup"
+          />
+        </view>
+        <view class="pup-sku-body">
+          <view class="pup-sku-area">
+            <view
+              v-if="skuList.length"
+              class="sku-box"
+            >
+              <block
+                v-for="(skuGroupItem, skuGroupItemIndex) in skuGroupList"
+                :key="skuGroupItemIndex"
+              >
+                <view
+                  v-for="(skuLine, key) in skuGroupItem"
+                  :key="key"
+                  class="items sku-text"
+                >
+                  <text class="sku-kind">
+                    {{ key }}
+                  </text>
+                  <view class="con">
+                    <text
+                      v-for="skuLineItem in skuLine"
+                      :key="skuLineItem"
+                      class="sku-choose-item"
+                      :class="[selectedPropList.indexOf(key + ':' + skuLineItem) !== -1?'active':'',
+                               isSkuLineItemNotOptional(allProperties,selectedPropObj,key,skuLineItem,propKeys)? 'dashed' : '']"
+                      @click="toChooseItem(skuGroupItemIndex, skuLineItem, key)"
+                    >
+                      {{ skuLineItem }}
+                    </text>
+                  </view>
+                </view>
+              </block>
+            </view>
+          </view>
+          <view class="pup-sku-count">
+            <view class="num-wrap">
+              <view
+                class="minus"
+                @tap="onCountMinus"
+              >
+                <text class="row" />
+              </view>
+              <view class="text-wrap">
+                <input
+                  type="number"
+                  :value="prodNum"
+                  disabled
+                >
+              </view>
+              <view
+                class="plus"
+                @tap="onCountPlus"
+              >
+                <text class="row" />
+                <text class="col" />
+              </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
+      v-if="commentShow"
+      class="cmt-popup"
+    >
+      <view class="cmt-tit">
+        <view class="cmt-t">
+          商品评价
+          <text class="cmt-good">
+            好评度{{ prodCommData.positiveRating }}%
+          </text>
+        </view>
+        <text
+          class="close"
+          @tap="closePopup"
+        />
+      </view>
+      <view class="cmt-cont">
+        <view class="cmt-tag">
+          <text
+            data-evaluate="-1"
+            :class="evaluate==-1?'selected':''"
+            @tap="getProdCommPage"
+          >
+            全部({{ prodCommData.number }})
+          </text>
+          <text
+            data-evaluate="0"
+            :class="evaluate==0?'selected':''"
+            @tap="getProdCommPage"
+          >
+            好评({{ prodCommData.praiseNumber }})
+          </text>
+          <text
+            data-evaluate="1"
+            :class="evaluate==1?'selected':''"
+            @tap="getProdCommPage"
+          >
+            中评({{ prodCommData.secondaryNumber }})
+          </text>
+          <text
+            data-evaluate="2"
+            :class="evaluate==2?'selected':''"
+            @tap="getProdCommPage"
+          >
+            差评({{ prodCommData.negativeNumber }})
+          </text>
+          <text
+            data-evaluate="3"
+            :class="evaluate==3?'selected':''"
+            @tap="getProdCommPage"
+          >
+            有图({{ prodCommData.picNumber }})
+          </text>
+        </view>
+        <view class="cmt-items">
+          <block v-if="prodCommPage.records.length">
+            <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"
+                  />
+                  <view class="nickname">
+                    {{ item.nickName }}
+                  </view>
+                </view>
+              </view>
+              <view class="cmt-cnt">
+                {{ item.content }}
+              </view>
+              <scroll-view
+                v-if="item.pics.length"
+                class="cmt-attr"
+                scroll-x="true"
+              >
+                <image
+                  v-for="(commPic, index2) in item.pics"
+                  :key="index2"
+                  :src="commPic"
+                />
+              </scroll-view>
+              <view
+                v-if="item.replyContent"
+                class="cmt-reply"
+              >
+                <text class="reply-tit">
+                  店铺回复：
+                </text>
+                {{ item.replyContent }}
+              </view>
+            </view>
+          </block>
+          <view
+            v-if="!prodCommPage.records.length"
+            class="empty"
+          >
+            暂无评价
+          </view>
+        </view>
+        <view
+          v-if="prodCommPage.pages > prodCommPage.current"
+          class="load-more"
+        >
+          <text @tap="getMoreCommPage">
+            点击加载更多
+          </text>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const wxs = number()
+
+const indicatorDots = ref(true)
+const indicatorColor = ref('#f2f2f2')
+const indicatorActiveColor = ref('#eb2444')
+const autoplay = ref(true)
+const interval = ref(3000)
+const duration = ref(1000)
+const selectedProp = ref([])
+let prodId = 0
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  prodId = options.prodid// 加载商品信息
+  getProdInfo() // 加载商品数据
+  getProdCommData() // 加载评论项
+  getLittleProdComm() // 查看用户是否关注
+  getCollection()
+})
+
+const app = getApp()
+const totalCartNum = ref(0)
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  totalCartNum.value = app.globalData.totalCartCount
+})
+
+/**
+ * 分享设置
+ */
+onShareAppMessage(() => {
+  return {
+    title: prodName.value,
+    path: '/pages/prod/prod?prodid=' + prodId
+  }
+})
+
+const isCollection = ref(false)
+/**
+ * 获取是否关注信息
+ */
+const getCollection = () => {
+  uni.showLoading()
+  http.request({
+    url: '/p/user/collection/isCollection',
+    method: 'GET',
+    data: {
+      prodId
+    }
+  })
+    .then(({ data }) => {
+      isCollection.value = data
+      uni.hideLoading()
+    })
+}
+
+/**
+ * 添加或者取消收藏商品
+ */
+const addOrCannelCollection = () => {
+  uni.showLoading()
+  http.request({
+    url: '/p/user/collection/addOrCancel',
+    method: 'POST',
+    data: prodId
+  })
+    .then(() => {
+      isCollection.value = !isCollection.value
+      uni.hideLoading()
+    })
+}
+
+const skuList = ref([])
+const brief = ref('')
+const prodNum = ref(1)
+const pic = ref('')
+const imgs = ref('')
+const prodName = ref('')
+const price = ref(0)
+const content = ref('')
+/**
+ * 获取商品信息
+ */
+const getProdInfo = () => {
+  uni.showLoading()
+  http.request({
+    url: '/prod/prodInfo',
+    method: 'GET',
+    data: {
+      prodId // userType: 0
+    }
+  })
+    .then(({ data }) => {
+      uni.hideLoading()
+      if (!data) {
+        setTimeout(() => {
+          uni.navigateBack()
+        }, 1000)
+        return
+      }
+      imgs.value = data.imgs?.split(',')
+      content.value = util.formatHtml(data.content)
+      price.value = data.price
+      prodName.value = data.prodName
+      prodId = data.prodId
+      brief.value = data.brief
+      skuList.value = data.skuList
+      pic.value = data.pic
+      // 组装sku
+      groupSkuProp(data.skuList, data.price)
+      uni.hideLoading()
+    })
+}
+
+const prodCommData = ref({})
+const getProdCommData = () => {
+  http.request({
+    url: '/prodComm/prodCommData',
+    method: 'GET',
+    data: {
+      prodId
+    }
+  })
+    .then(({ data }) => {
+      prodCommData.value = data
+    })
+}
+
+const prodCommPage = ref({
+  current: 0,
+  pages: 0,
+  records: []
+})
+/**
+ * 获取部分评论
+ */
+const getLittleProdComm = () => {
+  if (prodCommPage.value.records.length) {
+    return
+  }
+  getProdCommPage()
+}
+
+const getMoreCommPage = () => {
+  getProdCommPage()
+}
+
+const littleCommPage = ref([])
+const evaluate = ref(-1)
+/**
+ * 获取分页获取评论
+ */
+const getProdCommPage = (e) => {
+  if (e) {
+    if (e.currentTarget.dataset.evaluate === evaluate.value) {
+      return
+    }
+    prodCommPage.value = {
+      current: 0,
+      pages: 0,
+      records: []
+    }
+    evaluate.value = e.currentTarget.dataset.evaluate
+  }
+
+  http.request({
+    url: '/prodComm/prodCommPageByProd',
+    method: 'GET',
+    data: {
+      prodId,
+      size: 10,
+      current: prodCommPage.value.current + 1,
+      evaluate: evaluate.value
+    }
+  })
+    .then(({ data }) => {
+      data.records.forEach(item => {
+        if (item.pics) {
+          item.pics = item.pics.split(',')
+        }
+      })
+      let records = prodCommPage.value.records
+      records = records.concat(data.records)
+      // 如果商品详情中没有评论的数据，截取两条到商品详情页商品详情
+      prodCommPage.value = {
+        current: data.current,
+        pages: data.pages,
+        records
+      }
+      if (!littleCommPage.value.length) {
+        littleCommPage.value = records.slice(0, 2)
+      }
+    })
+}
+let selectedPropObjList = null
+const skuGroup = ref({})
+const defaultSku = ref(null)
+const selectedPropObj = ref({})
+const propKeys = ref([])
+const allProperties = ref([])
+const findSku = ref(true)
+const skuGroupList = ref([])
+/**
+ * 组装SKU
+ */
+const groupSkuProp = (skuList, defaultPrice) => {
+  if (skuList.length === 1 && !skuList[0].properties) {
+    defaultSku.value = skuList[0]
+    findSku.value = true
+    return
+  }
+  const _skuGroupList = []
+  const skuGroupParam = {}
+  const _allProperties = []
+  const _propKeys = []
+  const _selectedPropObj = {}
+  const selectedPropObjListParam = []
+
+  let defaultSkuParam = null
+  for (let i = 0; i < skuList.length; i++) {
+    let isDefault = false
+    if (!defaultSkuParam && skuList[i].price == defaultPrice) {
+      defaultSkuParam = skuList[i]
+      isDefault = true
+    }
+    const properties = skuList[i].properties // 版本:公开版;颜色:金色;内存:64GB
+    _allProperties.push(properties)
+    const propList = properties.split(';') // ["版本:公开版","颜色:金色","内存:64GB"]
+    for (let j = 0; j < propList.length; j++) {
+      const propval = propList[j].split(':') // ["版本","公开版"]
+      let props = skuGroupParam[propval[0]] // 先取出 版本对应的值数组
+      // 如果当前是默认选中的sku，把对应的属性值 组装到selectedProp
+      if (isDefault) {
+        _propKeys.push(propval[0])
+        _selectedPropObj[propval[0]] = propval[1]
+        const selectedPropObjItem = {}
+        selectedPropObjItem[propval[0]] = propval[1]
+        selectedPropObjListParam.push(selectedPropObjItem)
+      }
+      if (!props) {
+        props = [] // 假设还没有版本，新建个新的空数组
+        props.push(propval[1]) // 把 "公开版" 放进空数组
+      } else {
+        if (props.indexOf(propval[1]) === -1) { // 如果数组里面没有"公开版"
+          props.push(propval[1]) // 把 "公开版" 放进数组
+        }
+      }
+      skuGroupParam[propval[0]] = props // 最后把数据 放回版本对应的值
+      const propListItem = {}
+      propListItem[propval[0]] = props
+      _skuGroupList.push(propListItem)
+    }
+  }
+  defaultSku.value = defaultSkuParam
+  propKeys.value = _propKeys
+  selectedPropObj.value = _selectedPropObj
+  skuGroup.value = skuGroupParam
+  selectedPropObjList = selectedPropObjListParam
+  skuGroupList.value = unique(_skuGroupList)
+  allProperties.value = _allProperties
+  parseSelectedObjToVals(skuList)
+}
+
+const selectedPropList = ref(null)
+/**
+ * 将已选的 {key:val,key2:val2}转换成 [val,val2]
+ */
+const parseSelectedObjToVals = (skuList) => {
+  const selectedPropObjListParam = selectedPropObjList
+  let selectedPropertiesParam = ''
+  const selectedPropListParam = []
+  const selectedPropShowListParam = []
+  for (let i = 0; i < selectedPropObjListParam.length; i++) {
+    const selectedPropObjItem = selectedPropObjListParam[i]
+    for (const key in selectedPropObjItem) {
+      if (Object.hasOwnProperty.call(selectedPropObjItem, key)) {
+        selectedPropListParam.push(key + ':' + selectedPropObjItem[key])
+        selectedPropShowListParam.push(selectedPropObjItem[key])
+        selectedPropertiesParam += key + ':' + selectedPropObjItem[key] + ';'
+      }
+    }
+  }
+  selectedPropertiesParam = selectedPropertiesParam.substring(0, selectedPropertiesParam.length - 1)
+  selectedPropList.value = selectedPropListParam
+  selectedPropObjList = selectedPropObjListParam
+  let findSkuParam = false
+  for (let i = 0; i < skuList.length; i++) {
+    if (skuList[i].properties == selectedPropertiesParam) {
+      findSkuParam = true
+      defaultSku.value = skuList[i]
+      break
+    }
+  }
+  findSku.value = findSkuParam
+}
+
+/**
+ * 判断当前的规格值 是否可以选
+ */
+const isSkuLineItemNotOptional = (allProperties, selectedPropObjParam, key, item, propKeys) => {
+  const selectedPropObj = Object.assign({}, selectedPropObjParam)
+  let properties = ''
+  selectedPropObj[key] = item
+  for (let j = 0; j < propKeys.length; j++) {
+    properties += propKeys[j] + ':' + selectedPropObj[propKeys[j]] + ';'
+  }
+  properties = properties.substring(0, properties.length - 1)
+  for (let i = 0; i < allProperties.length; i++) {
+    if (properties == allProperties[i]) {
+      return false
+    }
+  }
+  for (let i = 0; i < allProperties.length; i++) {
+    if (allProperties[i].indexOf(item) >= 0) {
+      return true
+    }
+  }
+  return false
+}
+
+/**
+ * 规格点击事件
+ */
+const toChooseItem = (skuGroupItemIndex, skuLineItem, key) => {
+  selectedPropObjList[skuGroupItemIndex][key] = skuLineItem
+  selectedPropObj.value[key] = skuLineItem
+  parseSelectedObjToVals(skuList.value)
+}
+
+/**
+ * 去重
+ */
+const unique = (arr) => {
+  const map = {}
+  arr.forEach(item => {
+    const obj = {}
+    Object.keys(item).sort().map(key => (obj[key] = item[key]))
+    map[JSON.stringify(obj)] = item
+  })
+  return Object.keys(map).map(key => JSON.parse(key))
+}
+
+/**
+ * 跳转到首页
+ */
+const toHomePage = () => {
+  uni.switchTab({
+    url: '/pages/index/index'
+  })
+}
+
+/**
+ * 跳转到购物车
+ */
+const toCartPage = () => {
+  uni.switchTab({
+    url: '/pages/basket/basket'
+  })
+}
+
+const shopId = 1
+/**
+ * 加入购物车
+ */
+const addToCart = () => {
+  uni.showLoading({
+    mask: true
+  })
+  http.request({
+    url: '/p/shopCart/changeItem',
+    method: 'POST',
+    data: {
+      basketId: 0,
+      count: prodNum.value,
+      prodId,
+      shopId,
+      skuId: defaultSku.value.skuId
+    }
+  })
+    .then(() => {
+      totalCartNum.value = totalCartNum.value + prodNum.value
+      uni.hideLoading()
+      uni.showToast({
+        title: '加入购物车成功',
+        icon: 'none'
+      })
+    })
+}
+
+/**
+ * 立即购买
+ */
+const buyNow = () => {
+  uni.setStorageSync('orderItem', JSON.stringify({
+    prodId,
+    skuId: defaultSku.value.skuId,
+    prodCount: prodNum.value,
+    shopId
+  }))
+  uni.navigateTo({
+    url: '/pages/submit-order/submit-order?orderEntry=1'
+  })
+}
+
+/**
+ * 减数量
+ */
+const onCountMinus = () => {
+  if (prodNum.value > 1) {
+    prodNum.value = prodNum.value - 1
+  }
+}
+
+/**
+ * 加数量
+ */
+const onCountPlus = () => {
+  if (prodNum.value < 1000) {
+    prodNum.value = prodNum.value + 1
+  }
+}
+
+const skuShow = ref(false)
+const showSku = () => {
+  skuShow.value = true
+}
+
+const commentShow = ref(false)
+const showComment = () => {
+  commentShow.value = true
+}
+
+const closePopup = () => {
+  skuShow.value = false
+  commentShow.value = false
+}
+</script>
+
+<style scoped lang="scss">
+@use './prod.scss';
+</style>

front-end/mall4uni/src/pages/recent-news/recent-news.scss

@@ -0,0 +1,34 @@
+.recent-news {
+  background: #fff;
+  .news-item {
+    padding: 20rpx 20rpx 0 20rpx;
+    position: relative;
+    &::after {
+      content: " ";
+      width: 100%;
+      height: 2rpx;
+      background-color: #e1e1e1;
+      left: 20rpx;
+      display: block;
+      position: absolute;
+    }
+    .news-item-title {
+      font-size: 28rpx;
+      text-align: left;
+    }
+    .news-item-date {
+      font-size: 24rpx;
+      color: #999;
+      text-align: right;
+      margin-top: 10rpx;
+      margin-bottom: 20rpx;
+    }
+  }
+  .empty {
+    display: block;
+    padding-top: 200rpx;
+    color: #999;
+    font-size: 26rpx;
+    text-align: center;
+  }
+}

front-end/mall4uni/src/pages/recent-news/recent-news.vue

@@ -0,0 +1,60 @@
+<template>
+  <view class="container">
+    <view class="recent-news">
+      <block
+        v-for="(item, index) in news"
+        :key="index"
+      >
+        <view
+          class="news-item"
+          :data-id="item.id"
+          @tap="toNewsDetail"
+        >
+          <view class="news-item-title">
+            {{ item.title }}
+          </view>
+          <view class="news-item-date">
+            {{ item.publishTime }}
+          </view>
+        </view>
+      </block>
+      <view
+        v-if="!news || !news.length"
+        class="empty"
+      >
+        暂无数据
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const news = ref([])
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  // 加载公告
+  http.request({
+    url: '/shop/notice/noticeList',
+    method: 'GET'
+  })
+    .then(({ data }) => {
+      news.value = data.records
+    })
+})
+
+/**
+ * 跳转公告详情页
+ * @param e
+ */
+const toNewsDetail = (e) => {
+  uni.navigateTo({
+    url: '/pages/news-detail/news-detail?id=' + e.currentTarget.dataset.id
+  })
+}
+</script>
+
+<style scoped lang="scss">
+@use './recent-news.scss';
+</style>

front-end/mall4uni/src/pages/register/register.scss

@@ -0,0 +1,124 @@
+.con {
+  background: #fff;
+  height: 100%;
+  margin-top: 50px;
+}
+image {
+  display: block;
+  width: 150rpx;
+  height: 150rpx;
+  margin: auto;
+  border-radius: 50%;
+  width: 150rpx;
+  height: 150rpx;
+  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;
+  border: 1rpx solid #0ab906;
+  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;
+  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;
+  margin-bottom: 50rpx;
+  font-size: 32rpx;
+}
+.item {
+  display: block;
+  margin-bottom: 30rpx;
+  margin-bottom: 30rpx;
+}
+.account {
+  display: flex;
+  background: #f8f8f8;
+  padding: 15rpx;
+  box-sizing: border-box;
+  font-size: 26rpx;
+  align-items: center;
+  input {
+    padding-left: 20rpx;
+    width: 75%;
+    padding-left: 20rpx;
+  }
+}
+button {
+  &::after {
+    border: 0 !important;
+  }
+}
+.operate {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.to-register {
+  font-size: 28rpx;
+  color: #00AAFF;
+  font-size: 28rpx;
+}
+.error {
+  .error-text {
+    display: block;
+    width: 100%;
+    font-size: 28rpx;
+    color: #e43130;
+    text-align: left;
+    margin-top: 10rpx;
+    font-size: 28rpx;
+    margin-top: 10rpx;
+    .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;
+      width: 26rpx;
+      height: 26rpx;
+      line-height: 26rpx;
+      margin-right: 12rpx;
+      font-size: 22rpx;
+    }
+  }
+}

front-end/mall4uni/src/pages/register/register.vue

@@ -0,0 +1,166 @@
+<template>
+  <view class="register">
+    <view class="con">
+      <image src="@/static/logo.png" />
+      <!-- 登录 -->
+      <view class="login-form">
+        <view :class="['item',errorTips==1? 'error':'']">
+          <view class="account">
+            <text class="input-item">
+              账号
+            </text>
+            <input
+              type="text"
+              data-type="account"
+              placeholder-class="inp-palcehoder"
+              placeholder="请输入账号名称"
+              @input="getInputVal"
+            >
+          </view>
+          <view
+            v-if="errorTips==1"
+            class="error-text"
+          >
+            <text class="warning-icon">
+              !
+            </text>
+            请输入账号！
+          </view>
+        </view>
+        <view :class="['item',errorTips==2? 'error':'']">
+          <view class="account">
+            <text class="input-item">
+              密码
+            </text>
+            <input
+              type="password"
+              data-type="password"
+              placeholder-class="inp-palcehoder"
+              placeholder="请输入密码"
+              @input="getInputVal"
+            >
+          </view>
+          <view
+            v-if="errorTips==2"
+            class="error-text"
+          >
+            <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 setup>
+import { encrypt } from '@/utils/crypto.js'
+
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  // 头部导航标题
+  uni.setNavigationBarTitle({
+    title: '用户注册'
+  })
+})
+
+const principal = ref('') // 账号
+const credentials = ref('') // 密码
+/**
+ * 输入框的值
+ */
+const getInputVal = (e) => {
+  const type = e.currentTarget.dataset.type
+  if (type == 'account') {
+    principal.value = e.detail.value
+  } else if (type == 'password') {
+    credentials.value = e.detail.value
+  }
+}
+
+const errorTips = ref(0) // 输入错误提示:  1账号输入  2密码输入
+/**
+ * 注册
+ */
+const toRegister = () => {
+  if (principal.value.length == 0) {
+    errorTips.value = 1
+  } else if (credentials.value.length == 0) {
+    errorTips.value = 2
+  } else {
+    errorTips.value = 0
+
+    uni.showLoading()
+    http.request({
+      url: '/user/register',
+      method: 'post',
+      data: {
+        userName: principal.value,
+        passWord: encrypt(credentials.value)
+      }
+    })
+      .then(() => {
+        uni.hideLoading()
+        uni.showToast({
+          title: '注册成功，请登录',
+          icon: 'none',
+          duration: 1500
+        })
+        setTimeout(() => {
+          uni.navigateTo({
+            url: '/pages/accountLogin/accountLogin'
+          })
+        }, 1800)
+      })
+  }
+}
+/**
+ * 去登陆
+ */
+const toLogin = () => {
+  uni.navigateTo({
+    url: '/pages/accountLogin/accountLogin'
+  })
+}
+
+/**
+ * 回到首页
+ */
+const toIndex = () => {
+  uni.switchTab({
+    url: '/pages/index/index'
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+@import "./register.scss";
+</style>

front-end/mall4uni/src/pages/search-page/search-page.scss

@@ -0,0 +1,119 @@
+.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-box {
+    position: relative;
+    height: 60rpx;
+    background: #f7f7f7;
+    z-index: 999;
+    width: 80%;
+    margin-left: 70rpx;
+    border-radius: 50rpx;
+    margin: 20rpx 0 20rpx 20rpx;
+    .search-img {
+      width: 32rpx;
+      height: 32rpx;
+      position: absolute;
+      left: 20rpx;
+      top: 14rpx;
+      display: block;
+    }
+  }
+  .search-hint {
+    font-size: 28rpx;
+    position: absolute;
+    right: 30rpx;
+    top: 31rpx;
+    color: #eb2444;
+  }
+}
+.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-display {
+  background: #fff;
+  padding: 20rpx;
+  margin-top: 100rpx;
+  .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;
+    .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;
+  }
+  .his-search-tags {
+    overflow: hidden;
+    font-size: 26rpx;
+    text-align: center;
+    display: inline-block;
+    .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;
+  }
+}
+.search-tit-empty {
+  display: block;
+  margin: 0 auto;
+  text-align: center;
+  width: 100%;
+  font-size: 24rpx;
+  color: #aaa;
+}

front-end/mall4uni/src/pages/search-page/search-page.vue

@@ -0,0 +1,183 @@
+<template>
+  <view class="container">
+    <!-- 搜索框 -->
+    <view class="search-bar">
+      <view class="search-box">
+        <input
+          placeholder="输入关键字搜索"
+          class="sear-input"
+          confirm-type="search"
+          :value="prodName"
+          @confirm="toSearchProdPage"
+          @input="getSearchContent"
+        >
+        <image
+          src="@/static/images/icon/search.png"
+          class="search-img"
+        />
+      </view>
+      <text
+        class="search-hint"
+        @tap="goBackIndex"
+      >
+        取消
+      </text>
+    </view>
+
+    <view class="search-display">
+      <!-- 热门搜索 -->
+      <view class="hot-search">
+        <view class="title-text">
+          热门搜索
+        </view>
+        <view
+          v-if="hotSearchList && hotSearchList.length"
+          class="hot-search-tags"
+        >
+          <block
+            v-for="(item, index) in hotSearchList"
+            :key="index"
+          >
+            <text
+              class="tags"
+              :data-name="item.content"
+              @tap="onHistSearch"
+            >
+              {{ item.title }}
+            </text>
+          </block>
+        </view>
+        <view
+          v-else
+          class="search-tit-empty"
+        >
+          暂无数据
+        </view>
+      </view>
+
+      <!-- 搜索历史 -->
+      <view
+        v-if="recentSearch && recentSearch.length"
+        class="history-search"
+      >
+        <view class="title-text history-line">
+          搜索历史
+          <view class="clear-history">
+            <image
+              src="@/static/images/icon/clear-his.png"
+              @tap="clearSearch"
+            />
+          </view>
+        </view>
+        <block
+          v-for="(item, index) in recentSearch"
+          :key="index"
+        >
+          <view class="his-search-tags">
+            <text
+              class="tags"
+              :data-name="item"
+              @tap="onHistSearch"
+            >
+              {{ item }}
+            </text>
+          </view>
+        </block>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const hotSearchList = ref([])
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  http.request({
+    url: '/search/hotSearchByShopId',
+    method: 'GET',
+    data: {
+      number: 10,
+      shopId: 1,
+      sort: 1
+    }
+  })
+    .then(({ data }) => {
+      hotSearchList.value = data
+    })
+  // 获取历史搜索
+  getRecentSearch()
+})
+
+const prodName = ref('')
+/**
+ * 生命周期函数--监听页面隐藏
+ */
+onHide(() => {
+  prodName.value = ''
+})
+
+const recentSearch = ref([])
+/**
+ * 获取历史搜索
+ */
+const getRecentSearch = () => {
+  recentSearch.value = uni.getStorageSync('recentSearch')
+}
+
+/**
+ * 搜索提交
+ */
+const toSearchProdPage = () => {
+  if (prodName.value.trim()) {
+    // 记录最近搜索
+    let recentSearchStorage = uni.getStorageSync('recentSearch') || []
+    recentSearchStorage = recentSearchStorage.filter(item => item !== prodName.value)
+    recentSearchStorage.unshift(prodName.value)
+    if (recentSearchStorage.length > 10) {
+      recentSearchStorage.pop()
+    }
+    uni.setStorageSync('recentSearch', recentSearchStorage) // 跳转到商品列表页
+    uni.navigateTo({
+      url: '/pages/search-prod-show/search-prod-show?prodName=' + prodName.value
+    })
+  }
+}
+
+/**
+ * 清空搜索历史
+ */
+const clearSearch = () => {
+  uni.removeStorageSync('recentSearch')
+  getRecentSearch()
+}
+
+/**
+ * 返回首页
+ */
+const goBackIndex = () => {
+  uni.navigateBack({
+    url: '/pages/search-page/search-page'
+  })
+}
+
+/**
+ * 输入商品名获取数据 || 绑定输入值
+ */
+const getSearchContent = (e) => {
+  prodName.value = e.detail.value
+}
+
+/**
+ * 点击搜素历史
+ */
+const onHistSearch = (e) => {
+  prodName.value = e.currentTarget.dataset.name
+  toSearchProdPage()
+}
+</script>
+
+<style scoped lang="scss">
+@use './search-page.scss';
+</style>

front-end/mall4uni/src/pages/search-prod-show/search-prod-show.scss

@@ -0,0 +1,186 @@
+.container {
+  background: #f4f4f4;
+  .empty {
+    text-align: center;
+    color: #999;
+    font-size: 26rpx;
+  }
+  .empty.empty-top {
+    margin-top: 300rpx;
+  }
+}
+.fixed-box {
+  position: fixed;
+  width: 100%;
+  top: 0;
+  z-index: 999;
+  background: #fff;
+  .tabs {
+    width: 100%;
+    height: 80rpx;
+    line-height: 80rpx;
+    padding: 10rpx 0;
+    z-index: 999;
+    background: #fff;
+    &::after {
+      content: '';
+      background-color: #e1e1e1;
+      left: 0;
+      height: 1px;
+      transform-origin: 50% 100% 0;
+      bottom: 0;
+      position: absolute;
+      display: block;
+      width: 100%;
+    }
+    .tab-item {
+      display: inline-block;
+      width: 33.33%;
+      text-align: center;
+      font-size: 28rpx;
+    }
+    .tab-item.on {
+      color: #eb2444;
+    }
+  }
+}
+.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;
+  margin: 30rpx 0;
+  .search-box {
+    position: relative;
+    height: 60rpx;
+    background: #f7f7f7;
+    z-index: 999;
+    width: 80%;
+    border-radius: 50rpx;
+    margin-right: 30rpx;
+    flex: 1;
+    .search-img {
+      width: 32rpx;
+      height: 32rpx;
+      position: absolute;
+      left: 20rpx;
+      top: 14rpx;
+      display: block;
+    }
+  }
+  .search-hint {
+    font-size: 28rpx;
+    position: absolute;
+    right: 30rpx;
+    top: 31rpx;
+    color: #eb2444;
+  }
+  .search-list-img {
+    width: 40rpx;
+    height: 40rpx;
+    font-size: 0;
+    image {
+      width: 100%;
+      height: 100%;
+    }
+  }
+}
+.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;
+}
+.prod-show {
+  background: #fff;
+  .prod-items {
+    float: left;
+    background: #fff;
+    padding-bottom: 20rpx;
+    box-sizing: border-box;
+  }
+}
+.prod-items {
+  margin: 0 20rpx;
+}
+.hotsale-item-cont {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
+.prod-list {
+  padding-top: 150rpx;
+  min-height: calc(100vh - 150rpx);
+  .cont-item {
+    padding: 0 20rpx 20rpx 20rpx;
+    .show-item {
+      .more-prod-pic {
+        text-align: center;
+        width: 170rpx;
+        height: 170rpx;
+        font-size: 0;
+        .more-pic {
+          width: 100%;
+          height: 100%;
+          vertical-align: middle;
+        }
+      }
+      position: relative;
+      display: flex;
+      justify-content: flex-start;
+      padding: 20rpx;
+      border-radius: 20rpx;
+      background: #fff;
+      margin-bottom: 20rpx;
+      box-shadow: 0 16rpx 32rpx 0 rgba(7, 17, 27, 0.05);
+      .prod-text-right {
+        margin-left: 20rpx;
+        width: 75%;
+        .cate-prod-info {
+          font-size: 22rpx;
+          color: #999;
+          margin: 10rpx 0 20rpx 0;
+        }
+        .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-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-price.more {
+          font-size: 28rpx;
+          color: #eb2444;
+          font-family: arial;
+        }
+      }
+    }
+  }
+}

front-end/mall4uni/src/pages/search-prod-show/search-prod-show.vue

@@ -0,0 +1,223 @@
+<template>
+  <view class="container">
+    <!-- 搜索框 -->
+    <view class="fixed-box">
+      <view class="search-bar">
+        <view class="search-box">
+          <input
+            placeholder="输入关键字搜索"
+            class="sear-input"
+            :value="prodName"
+            confirm-type="search"
+            @input="getSearchContent"
+            @confirm="toSearchConfirm"
+          >
+          <image
+            src="@/static/images/icon/search.png"
+            class="search-img"
+          />
+        </view>
+        <view
+          class="search-list-img"
+          @tap="changeShowType"
+        >
+          <image
+            v-if="showType==1"
+            src="@/static/images/icon/search-col.png"
+          />
+          <image
+            v-if="showType==2"
+            src="@/static/images/icon/search-col2.png"
+          />
+        </view>
+      </view>
+      <view class="tabs">
+        <text
+          :class="'tab-item complete ' + (sts==0?'on':'')"
+          data-sts="0"
+          @tap="onStsTap"
+        >
+          综合
+        </text>
+        <text
+          :class="'tab-item ' + (sts==1?'on':'')"
+          data-sts="1"
+          @tap="onStsTap"
+        >
+          销量
+        </text>
+        <text
+          :class="'tab-item ' + (sts==2?'on':'')"
+          data-sts="2"
+          @tap="onStsTap"
+        >
+          价格
+        </text>
+      </view>
+    </view>
+
+    <!-- 商品列表 -->
+    <view class="prod-list">
+      <!-- 横向列表 -->
+      <view
+        v-if="showType==1"
+        class="prod-show"
+      >
+        <view class="hotsale-item-cont">
+          <block
+            v-for="(item, index) in searchProdList"
+            :key="index"
+          >
+            <production
+              :item="item"
+              sts="6"
+            />
+          </block>
+        </view>
+      </view>
+
+      <!-- 纵向列表 -->
+      <view
+        v-if="showType==2"
+        class="cont-item"
+      >
+        <block
+          v-for="(item, index) in searchProdList"
+          :key="index"
+        >
+          <view
+            class="show-item"
+            :data-prodid="item.prodId"
+            @tap="toProdPage"
+          >
+            <view class="more-prod-pic">
+              <image
+                :src="item.pic"
+                class="more-pic"
+              />
+            </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
+        v-if="!searchProdList.length"
+        :class="['empty',showType==1? 'empty-top':'']"
+      >
+        暂无结果
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const wxs = number()
+const prodName = ref('')
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  prodName.value = options.prodName
+})
+
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  toLoadData()
+})
+
+const showType = ref(2)
+const changeShowType = () => {
+  if (showType.value == 1) {
+    showType.value = 2
+  } else {
+    showType.value = 1
+  }
+}
+
+/**
+ * 输入商品获取数据
+ * @param e
+ */
+const getSearchContent = (e) => {
+  prodName.value = e.detail.value
+}
+
+const sts = ref(0)
+const searchProdList = ref([])
+/**
+ *  请求热门搜索商品接口
+ */
+const toLoadData = () => {
+  http.request({
+    url: '/search/searchProdPage',
+    method: 'GET',
+    data: {
+      current: 1,
+      prodName: prodName.value,
+      size: 10,
+      sort: sts.value
+    }
+  })
+    .then(({ data }) => {
+      searchProdList.value = data.records
+    })
+}
+
+/**
+ * 当前搜索页二次搜索商品
+ */
+const toSearchConfirm = (e) => {
+  if (e.detail.value) {
+    let recentSearch = uni.getStorageSync('recentSearch') || []
+    recentSearch = recentSearch.filter(item => item !== prodName.value)
+    recentSearch.unshift(prodName.value)
+    if (recentSearch.length > 10) {
+      recentSearch.pop()
+    }
+    uni.setStorageSync('recentSearch', recentSearch)
+  }
+  uni.redirectTo({
+    url: '/pages/search-prod-show/search-prod-show?prodName=' + e.detail.value
+  })
+}
+
+/**
+ * 状态点击事件
+ */
+const onStsTap = (e) => {
+  sts.value = e.currentTarget.dataset.sts
+  toLoadData()
+}
+
+const toProdPage = (e) => {
+  uni.navigateTo({
+    url: '/pages/prod/prod?prodid=' + e.currentTarget.dataset.prodid
+  })
+}
+</script>
+
+<style scoped lang="scss">
+@use './search-prod-show.scss';
+</style>

front-end/mall4uni/src/pages/sub-category/sub-category.scss

@@ -0,0 +1,109 @@
+.container {
+  background: #f4f4f4;
+}
+.category-tit {
+  width: 100%;
+  white-space: nowrap;
+  position: fixed;
+  top: 0px;
+  z-index: 999;
+  background-color: #fff;
+  border-bottom: 2rpx solid #f4f4f4;
+  font-size: 30rpx;
+  .category-item {
+    display: inline-block;
+    padding: 20rpx 10rpx;
+    margin: 0 20rpx;
+    box-sizing: border-box;
+    font-size: 28rpx;
+  }
+}
+.prod-item {
+  height: calc(100vh - 100rpx);
+}
+.on {
+  border-bottom: 4rpx solid #e43130;
+  color: #e43130;
+}
+::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  color: transparent;
+}
+.empty {
+  margin-top: 200rpx;
+}
+.prod-items {
+  width: 345rpx;
+  display: inline-block;
+  background: #fff;
+  padding-bottom: 20rpx;
+  box-sizing: border-box;
+  box-shadow: 0rpx 6rpx 8rpx rgba(58,134,185,0.2);
+  &:nth-child(2n-1) {
+    margin: 20rpx 10rpx 10rpx 20rpx;
+  }
+  &:nth-child(2n) {
+    margin: 20rpx 20rpx 10rpx 10rpx;
+  }
+  .hot-imagecont {
+    .hotsaleimg {
+      width: 341rpx;
+      height: 341rpx;
+    }
+    font-size: 0;
+    text-align: center;
+  }
+  .hot-text {
+    .hotprod-text {
+      font-size: 28rpx;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    margin-top: 20rpx;
+    padding: 0 10rpx;
+    .prod-info {
+      font-size: 22rpx;
+      color: #999;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .prod-text-info {
+      position: relative;
+      height: 70rpx;
+      line-height: 70rpx;
+      font-family: Arial;
+      .hotprod-price {
+        display: inline;
+        font-size: 26rpx;
+        color: #eb2444;
+      }
+      .basket-img {
+        width: 50rpx;
+        height: 50rpx;
+        position: absolute;
+        right: 0;
+        bottom: 7rpx;
+        padding: 8rpx;
+      }
+    }
+  }
+}
+.more-prod {
+  .prod-text-right {
+    .prod-info {
+      font-size: 22rpx;
+      color: #999;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
+}
+.empty-wrap {
+  color: #aaa;
+  text-align: center;
+  padding-top: 400rpx;
+}

front-end/mall4uni/src/pages/sub-category/sub-category.vue

@@ -0,0 +1,177 @@
+<template>
+  <view class="Mall4j container">
+    <!-- 顶部子分类tab -->
+    <scroll-view
+      scroll-x="true"
+      class="category-tit"
+      :scroll-into-view="intoView"
+      :scroll-with-animation="true"
+    >
+      <block
+        v-for="(item, index) in subCategoryList"
+        :key="index"
+      >
+        <view
+          :id="'sw' + item.categoryId"
+          :class="'category-item ' + (item.categoryId==categoryId? 'on':'')"
+          :data-id="item.categoryId"
+          @tap="onSubCategoryTap"
+        >
+          {{ item.categoryName }}
+        </view>
+      </block>
+    </scroll-view>
+    <!-- 商品列表 -->
+    <view class="prod-item">
+      <block v-if="prodList.length">
+        <block
+          v-for="(prod, key) in prodList"
+          :key="key"
+        >
+          <view
+            class="prod-items"
+            :data-prodid="prod.prodId"
+            @tap="toProdPage"
+          >
+            <view class="hot-imagecont">
+              <image
+                :src="prod.pic"
+                class="hotsaleimg"
+              />
+            </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>
+            </view>
+          </view>
+        </block>
+      </block>
+      <view
+        v-else
+        class="empty-wrap"
+      >
+        暂无商品数据~
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const wxs = number()
+
+const parentId = ref('')
+const categoryId = ref(0)
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  parentId.value = options.parentId
+  categoryId.value = options.categoryId
+  getSubCategory()
+  getProdList()
+})
+
+const current = ref(1)
+const pages = ref(0)
+/**
+ * 页面上拉触底事件的处理函数
+ */
+onReachBottom(() => {
+  if (current.value < pages.value) {
+    current.value = current.value + 1
+    getProdList()
+  }
+})
+
+const intoView = ref('')
+const subCategoryList = ref([])
+/**
+ * 获取顶栏子分类数据
+ */
+const getSubCategory = () => {
+  http.request({
+    url: '/category/categoryInfo',
+    method: 'GET',
+    data: {
+      parentId: parentId.value
+    }
+  })
+    .then(({ data }) => {
+      subCategoryList.value = data
+      nextTick(() => {
+        intoView.value = 'sw' + categoryId.value
+      })
+    })
+}
+
+const prodList = ref([])
+const isLoaded = ref(false) // 列表是否加载完毕
+/**
+ * 根据分类id获取商品列表数据
+ */
+const getProdList = () => {
+  isLoaded.value = false
+
+  http.request({
+    url: '/prod/pageProd',
+    method: 'GET',
+    data: {
+      categoryId: categoryId.value,
+      current: current.value,
+      size: 10,
+      sort: 0,
+      isAllProdType: true
+    }
+  })
+    .then(({ data }) => {
+      isLoaded.value = true
+      prodList.value = data.current == 1 ? data.records : prodList.value.concat(data.records)
+      current.value = data.current
+      pages.value = data.pages
+    })
+}
+
+/**
+ * 切换顶部分类
+ */
+const onSubCategoryTap = (e) => {
+  categoryId.value = e.currentTarget.dataset.id
+  current.value = 1
+  pages.value = 0
+  intoView.value = 'sw' + e.currentTarget.dataset.id
+  getProdList()
+}
+
+/**
+ * 跳转商品下详情
+ */
+const toProdPage = (e) => {
+  const prodid = e.currentTarget.dataset.prodid
+  if (prodid) {
+    uni.navigateTo({
+      url: '/pages/prod/prod?prodid=' + prodid
+    })
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import "./sub-category.scss";
+</style>

front-end/mall4uni/src/pages/submit-order/submit-order.scss

@@ -0,0 +1,429 @@
+.container {
+  background: #f4f4f4;
+}
+.submit-order {
+  margin-bottom: 100rpx;
+  padding-bottom: 160rpx;
+  .delivery-addr {
+    position: relative;
+    background: #fff;
+    .addr-icon {
+      width: 32rpx;
+      height: 32rpx;
+      display: block;
+      position: absolute;
+      left: 30rpx;
+      top: 24rpx;
+      image {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    .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;
+      .item {
+        font-size: 30rpx;
+        margin-right: 30rpx;
+        vertical-align: top;
+        display: inline-block;
+      }
+    }
+    .addr {
+      font-size: 26rpx;
+      line-height: 36rpx;
+      color: #999;
+      width: 90%;
+      padding-bottom: 20rpx;
+      margin-top: 15rpx;
+      word-wrap: break-word;
+    }
+    .arrow {
+      width: 15rpx;
+      height: 15rpx;
+      border-top: 2rpx solid #777;
+      border-right: 2rpx solid #777;
+      transform: rotate(45deg);
+      position: absolute;
+      right: 30rpx;
+      top: 60rpx;
+    }
+    .arrow.empty {
+      top: 39rpx;
+    }
+  }
+}
+.delivery-addr {
+  .addr-bg {
+    .add-addr {
+      .plus-sign {
+        color: #eb2444;
+        border: 2rpx solid #eb2444;
+        padding: 0rpx 6rpx;
+        margin-right: 10rpx;
+      }
+      font-size: 28rpx;
+      color: #666;
+      display: flex;
+      align-items: center;
+      padding: 30rpx 0;
+    }
+    padding: 0 30rpx;
+  }
+  .addr-bg.whole {
+    padding: 0 39rpx 0 77rpx;
+  }
+}
+.addr-bg {
+  .add-addr {
+    .plus-sign-img {
+      width: 32rpx;
+      height: 32rpx;
+      font-size: 0;
+      margin-right: 10rpx;
+      image {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+}
+.prod-item {
+  background-color: #fff;
+  margin-top: 15rpx;
+  font-size: 28rpx;
+  .item-cont {
+    .prod-pic {
+      image {
+        width: 180rpx;
+        height: 180rpx;
+        width: 100%;
+        height: 100%;
+      }
+      font-size: 0;
+      display: block;
+      width: 160rpx;
+      height: 160rpx;
+      overflow: hidden;
+      background: #fff;
+      margin-right: 16rpx;
+    }
+    display: flex;
+    align-items: center;
+    padding: 30rpx;
+    border-bottom: 2rpx solid #f1f1f1;
+    .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;
+      .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-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;
+      }
+    }
+  }
+  .order-num {
+    padding: 20rpx 30rpx;
+    display: flex;
+    justify-content: space-between;
+    font-size: 28rpx;
+    .clear-btn {
+      width: 32rpx;
+      height: 32rpx;
+      font-size: 0;
+      vertical-align: top;
+      margin-top: 6rpx;
+      margin-left: 42rpx;
+      position: relative;
+      &::after {
+        content: " ";
+        display: block;
+        position: absolute;
+        left: -10px;
+        top: 1px;
+        width: 1px;
+        height: 12px;
+        background: #ddd;
+      }
+      .clear-list-btn {
+        width: 100%;
+        height: 100%;
+        vertical-align: middle;
+      }
+    }
+  }
+  .total-num {
+    text-align: right;
+    padding: 20rpx 30rpx;
+    font-size: 28rpx;
+    .prodprice {
+      display: inline-block;
+      color: #333;
+    }
+    .prodcount {
+      margin-right: 20rpx;
+    }
+  }
+  .price-nums {
+    .prodprice {
+      position: absolute;
+      bottom: 0;
+    }
+    .prodcount {
+      position: absolute;
+      bottom: 5rpx;
+      right: 0;
+      color: #999;
+      font-family: verdana;
+    }
+  }
+}
+.order-state {
+  display: flex;
+  align-items: center;
+}
+.order-msg {
+  background: #fff;
+  margin-top: 15rpx;
+  padding: 0 30rpx;
+  font-size: 28rpx;
+  .msg-item {
+    border-top: 2rpx solid #f1f1f1;
+    &:first-child {
+      border: 0;
+    }
+    .item {
+      position: relative;
+      display: flex;
+      padding: 16rpx 0;
+      align-items: center;
+      .item-tit {
+        line-height: 48rpx;
+      }
+      .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;
+      }
+      .item-txt.price {
+        padding: 0;
+        text-align: right;
+      }
+      input {
+        flex: 1;
+      }
+      .coupon-btn {
+        display: block;
+        margin: 0 30rpx;
+        line-height: 28rpx;
+        color: #999;
+      }
+      .arrow {
+        width: 15rpx;
+        height: 15rpx;
+        border-top: 2rpx solid #999;
+        border-right: 2rpx solid #999;
+        transform: rotate(45deg);
+        position: absolute;
+        right: 0rpx;
+      }
+    }
+    .item.payment {
+      border-top: 2rpx solid #f1f1f1;
+      color: #eb2444;
+    }
+    .item.coupon {
+      border-bottom: 2rpx solid #e1e1e1;
+    }
+  }
+}
+.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);
+  .sub-order {
+    flex: 1;
+    margin: 0 30rpx;
+    line-height: 100rpx;
+    display: block;
+    text-align: left;
+    font-size: 28rpx;
+    .item-txt {
+      .price {
+        display: inline;
+        color: #eb2444;
+        font-size: 28rpx;
+      }
+    }
+  }
+  .footer-box {
+    padding: 0 10rpx;
+    width: 200rpx;
+    background: #eb2444;
+    text-align: center;
+    line-height: 100rpx;
+    color: #fff;
+  }
+}
+.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;
+  &::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;
+  text {
+    border-radius: 20px;
+    display: inline-block;
+    height: 20px;
+    line-height: 20px;
+    width: 450rpx;
+    padding: 7px;
+    color: #fff;
+    box-shadow: -1px 3px 3px #aaa;
+  }
+}
+.botm-empty {
+  height: 60px;
+}
+checkbox {
+  .wx-checkbox-input {
+    border-radius: 50%;
+    width: 35rpx;
+    height: 35rpx;
+  }
+  .wx-checkbox-input.wx-checkbox-input-checked {
+    background: #eb2444;
+    border-color: #eb2444;
+    &::before {
+      text-align: center;
+      font-size: 22rpx;
+      color: #fff;
+      background: transparent;
+      transform: translate(-50%, -50%) scale(1);
+      -webkit-transform: translate(-50%, -50%) scale(1);
+    }
+  }
+}

front-end/mall4uni/src/pages/submit-order/submit-order.vue

@@ -0,0 +1,527 @@
+<template>
+  <view>
+    <view class="container">
+      <view class="submit-order">
+        <!-- 收货地址 -->
+        <view
+          class="delivery-addr "
+          @tap="toAddrListPage"
+        >
+          <view
+            v-if="!userAddr"
+            class="addr-bg "
+          >
+            <view class="add-addr">
+              <view class="plus-sign-img">
+                <image src="@/static/images/icon/plus-sign.png" />
+              </view>
+              <text>新增收货地址</text>
+            </view>
+            <view class="arrow empty" />
+          </view>
+          <view
+            v-if="userAddr"
+            class="addr-bg whole"
+          >
+            <view class="addr-icon">
+              <image src="@/static/images/icon/addr.png" />
+            </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 class="prod-item">
+          <block
+            v-for="(item, index) in orderItems"
+            :key="index"
+          >
+            <view
+              class="item-cont"
+              :data-ordernum="item.primaryOrderNo"
+              @tap="toOrderDetailPage"
+            >
+              <view class="prod-pic">
+                <image :src="item.pic" />
+              </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="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
+                v-if="!coupons.canUseCoupons"
+                class="item-txt"
+              >
+                暂无可用
+              </text>
+              <text class="coupon-btn">
+                {{ coupons.totalLength ? coupons.totalLength : 0 }}张
+              </text>
+              <text class="arrow" />
+            </view>
+            <view class="item">
+              <text>买家留言：</text>
+              <input
+                v-model="remarks"
+                placeholder="给卖家留言"
+              >
+            </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
+      v-if="popupShow"
+      class="popup-hide"
+    >
+      <view class="popup-box">
+        <view class="popup-tit">
+          <text>优惠券</text>
+          <text
+            class="close"
+            @tap="closePopup"
+          />
+        </view>
+        <view class="coupon-tabs">
+          <view
+            :class="'coupon-tab ' + (couponSts==1?'on':'')"
+            data-sts="1"
+            @tap="changeCouponSts"
+          >
+            可用优惠券({{ coupons.canUseCoupons.length ? coupons.canUseCoupons.length : 0 }})
+          </view>
+          <view
+            :class="'coupon-tab ' + (couponSts==2?'on':'')"
+            data-sts="2"
+            @tap="changeCouponSts"
+          >
+            不可用优惠券({{ coupons.unCanUseCoupons.length ? coupons.unCanUseCoupons.length : 0 }})
+          </view>
+        </view>
+        <view class="popup-cnt">
+          <block v-if="couponSts == 1">
+            <view
+              v-for="(item, index) in coupons.canUseCoupons"
+              :key="index"
+            >
+              <coupon
+                :item="item"
+                order="true"
+                can-use="true"
+                @check-coupon="checkCoupon"
+              />
+            </view>
+          </block>
+          <block v-if="couponSts == 2">
+            <view
+              v-for="(item, index) in coupons.unCanUseCoupons"
+              :key="index"
+            >
+              <coupon
+                :item="item"
+                order="true"
+                can-use="false"
+              />
+            </view>
+          </block>
+          <view class="botm-empty" />
+        </view>
+        <view
+          v-if="couponSts==1"
+          class="coupon-ok"
+        >
+          <text @tap="choosedCoupon">
+            确定
+          </text>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const wxs = number()
+let orderEntry = '0' // 订单入口 0购物车 1立即购买
+/**
+ * 生命周期函数--监听页面加载
+ */
+onLoad((options) => {
+  orderEntry = options.orderEntry
+})
+
+const userAddr = ref(null)
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  const pages = getCurrentPages()
+  const currPage = pages[pages.length - 1]
+  if (currPage.selAddress === 'yes') {
+    // 将携带的参数赋值
+    userAddr.value = currPage.item
+  }
+  // 获取订单数据
+  loadOrderData()
+})
+
+let couponIds = []
+const coupons = ref({})
+const total = ref(0)
+const actualTotal = ref(0)
+const orderItems = ref([])
+const totalCount = ref(0)
+const transfee = ref(0)
+const shopReduce = ref('')
+/**
+ * 加载订单数据
+ */
+const loadOrderData = () => {
+  let addrId = 0
+  if (userAddr.value != null) {
+    addrId = userAddr.value.addrId
+  }
+  uni.showLoading({
+    mask: true
+  })
+  http.request({
+    url: '/p/order/confirm',
+    method: 'POST',
+    data: {
+      addrId,
+      orderItem: orderEntry === '1' ? JSON.parse(uni.getStorageSync('orderItem')) : undefined,
+      basketIds: orderEntry === '0' ? JSON.parse(uni.getStorageSync('basketIds')) : undefined,
+      couponIds,
+      userChangeCoupon: 1
+    }
+  })
+    .then(({ data }) => {
+      uni.hideLoading()
+      let orderItemsData = []
+      data.shopCartOrders[0].shopCartItemDiscounts?.forEach(itemDiscount => {
+        orderItemsData = orderItems.value?.concat(itemDiscount.shopCartItems)
+      })
+      if (data.shopCartOrders[0].coupons) {
+        const canUseCoupons = []
+        const unCanUseCoupons = []
+        data.shopCartOrders[0].coupons?.forEach(coupon => {
+          if (coupon.canUse) {
+            canUseCoupons.push(coupon)
+          } else {
+            unCanUseCoupons.push(coupon)
+          }
+        })
+        coupons.value = {
+          totalLength: data.shopCartOrders[0].coupons.length,
+          canUseCoupons,
+          unCanUseCoupons
+        }
+      }
+      orderItems.value = orderItemsData
+      actualTotal.value = data.actualTotal
+      total.value = data.total
+      totalCount.value = data.totalCount
+      userAddr.value = data.userAddr
+      transfee.value = data.shopCartOrders[0].transfee
+      shopReduce.value = data.shopCartOrders[0].shopReduce
+    })
+    .catch(err => {
+      uni.hideLoading()
+      chooseCouponErrHandle(err)
+    })
+}
+
+/**
+ * 优惠券选择出错处理方法
+ */
+const chooseCouponErrHandle = (res) => {
+  // 优惠券不能共用处理方法
+  if (res.statusCode == 601) {
+    uni.showToast({
+      title: res.data,
+      icon: 'none',
+      duration: 3000,
+      success: () => {
+        couponIds = []
+      }
+    })
+    setTimeout(() => {
+      loadOrderData()
+    }, 2500)
+  }
+}
+
+/**
+ * 提交订单
+ */
+const toPay = () => {
+  if (!userAddr.value) {
+    uni.showToast({
+      title: '请选择地址',
+      icon: 'none'
+    })
+    return
+  }
+  submitOrder()
+}
+
+const remarks = ref('')
+const submitOrder = () => {
+  uni.showLoading({
+    mask: true
+  })
+  http.request({
+    url: '/p/order/submit',
+    method: 'POST',
+    data: {
+      orderShopParam: [{
+        remarks: remarks.value,
+        shopId: 1
+      }]
+    }
+  })
+    .then(({ data }) => {
+      uni.hideLoading()
+      normalPay(data.orderNumbers)
+    })
+}
+
+/**
+ * 模拟支付，直接提交成功
+ * @param orderNumbers
+ */
+const normalPay = (orderNumbers) => {
+  uni.showLoading({
+    mask: true
+  })
+  http.request({
+    url: '/p/order/normalPay',
+    method: 'POST',
+    data: {
+      orderNumbers
+    }
+  })
+    .then(({ data }) => {
+      uni.hideLoading()
+      if (data) {
+        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'
+        })
+      }
+    })
+}
+
+const couponSts = ref(1)
+const changeCouponSts = (e) => {
+  couponSts.value = e.currentTarget.dataset.sts
+}
+
+const popupShow = ref(false)
+const showCouponPopup = () => {
+  popupShow.value = true
+}
+const closePopup = () => {
+  popupShow.value = false
+}
+
+/**
+ * 去地址页面
+ */
+const toAddrListPage = () => {
+  uni.navigateTo({
+    url: '/pages/delivery-address/delivery-address?order=0'
+  })
+}
+
+/**
+ * 确定选择好的优惠券
+ */
+const choosedCoupon = () => {
+  loadOrderData()
+  popupShow.value = false
+}
+
+/**
+ * 优惠券子组件发过来
+ */
+const checkCoupon = (e) => {
+  const index = couponIds.indexOf(e.detail.couponId)
+  if (index === -1) {
+    couponIds.push(e.detail.couponId)
+  } else {
+    couponIds.splice(index, 1)
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@use './submit-order.scss';
+</style>

front-end/mall4uni/src/pages/user/user.scss

@@ -0,0 +1,222 @@
+.container {
+  background-color: #f7f7f7;
+  padding-bottom: 60rpx;
+}
+.userinfo {
+  position: relative;
+  width: 100%;
+  background: #fff;
+  text-align: center;
+  padding: 30rpx 0;
+  .userinfo-con {
+    width: 240rpx;
+    margin: auto;
+    .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;
+      image {
+        width: 160rpx;
+        height: 160rpx;
+      }
+    }
+    .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;
+  .default-pic {
+    padding-right: 30rpx;
+    image {
+      width: 160rpx;
+      height: 160rpx;
+    }
+  }
+}
+.none-login {
+  button {
+    background: #fff;
+    &::after {
+      border: 0;
+    }
+  }
+  .unlogin {
+    font-size: 30rpx;
+    text-align: left;
+    padding: 0;
+  }
+  .click-login {
+    font-size: 26rpx;
+    color: #777;
+    text-align: left;
+    padding: 0;
+  }
+}
+.binding-phone {
+  position: relative;
+  background: #fff;
+  height: 80rpx;
+  line-height: 80rpx;
+  padding: 0 30rpx;
+  border-top: 2rpx solid #f7f7f7;
+  border-bottom: 2rpx solid #f7f7f7;
+  .show-tip {
+    font-size: 26rpx;
+  }
+  .gotobinding {
+    border-radius: 8rpx;
+    font-size: 28rpx;
+    color: #e24b4b;
+    font-weight: bold;
+  }
+}
+.list-cont {
+  width: 100%;
+  background: #f7f7f7;
+  margin-top: 20rpx;
+  .total-order {
+    background: #fff;
+    .order-tit {
+      display: flex;
+      justify-content: space-between;
+      height: 80rpx;
+      line-height: 80rpx;
+      font-size: 30rpx;
+      border-bottom: 1px solid #f7f7f7;
+      padding: 0 30rpx;
+      .checkmore {
+        font-size: 22rpx;
+        color: #80848f;
+        display: flex;
+        align-items: center;
+      }
+    }
+    .procedure {
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      font-size: 25rpx;
+      height: 160rpx;
+      .items {
+        position: relative;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        image {
+          width: 70rpx;
+          height: 70rpx;
+          margin-bottom: 20rpx;
+        }
+        .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;
+        }
+      }
+    }
+  }
+  .my-menu {
+    background-color: #fff;
+    margin-top: 20rpx;
+    .memu-item {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      height: 100rpx;
+      border-bottom: 2rpx solid #f7f7f7;
+      padding: 0 30rpx;
+      &:nth-child(1) {
+        border-top: 2rpx solid #f7f7f7;
+      }
+      &:last-child {
+        border-bottom: none;
+      }
+      text {
+        font-size: 28rpx;
+      }
+      image {
+        width: 50rpx;
+        height: 50rpx;
+        margin-right: 20rpx;
+      }
+      .i-name {
+        display: flex;
+        align-items: center;
+      }
+    }
+  }
+}
+.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;
+  .col-item {
+    text-align: center;
+    .num {
+      font-size: 16px;
+      font-weight: 700;
+      color: #3a86b9;
+    }
+    .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;
+  &:after {
+    border: 0;
+  }
+}

front-end/mall4uni/src/pages/user/user.vue

@@ -0,0 +1,375 @@
+<template>
+  <view class="container">
+    <!-- 用户信息 -->
+    <view
+      v-if="isAuthInfo"
+      class="userinfo"
+    >
+      <view class="userinfo-con">
+        <view class="userinfo-avatar">
+          <image
+            :src="
+              loginResult.pic
+                ?
+                  (loginResult.pic.indexOf('http') === -1 ? picDomain + loginResult.pic : loginResult.pic)
+                :
+                  '/static/images/icon/head04.png'
+            "
+          />
+        </view>
+        <view class="userinfo-name">
+          <view>{{ loginResult.nickName ? loginResult.nickName : "用户昵称" }}</view>
+        </view>
+      </view>
+    </view>
+
+    <view
+      v-if="!isAuthInfo"
+      class="userinfo-none"
+    >
+      <view
+        class="default-pic"
+        @tap="toLogin"
+      >
+        <image src="@/static/images/icon/head04.png" />
+      </view>
+      <view
+        class="none-login"
+        @tap="toLogin"
+      >
+        <button class="unlogin">
+          未登录
+        </button>
+        <button class="click-login">
+          点击登录账号
+        </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"
+            data-sts="0"
+            @tap="toOrderListPage"
+          >
+            <text>查看全部</text>
+            <text class="arrowhead" />
+          </view>
+        </view>
+        <view class="procedure">
+          <view
+            class="items"
+            data-sts="1"
+            @tap="toOrderListPage"
+          >
+            <image src="@/static/images/icon/toPay.png" />
+            <text>待支付</text>
+            <text
+              v-if="orderAmount.unPay>0"
+              class="num-badge"
+            >
+              {{ orderAmount.unPay }}
+            </text>
+          </view>
+          <view
+            class="items"
+            data-sts="2"
+            @tap="toOrderListPage"
+          >
+            <image src="@/static/images/icon/toDelivery.png" />
+            <text>待发货</text>
+            <text
+              v-if="orderAmount.payed>0"
+              class="num-badge"
+            >
+              {{ orderAmount.payed }}
+            </text>
+          </view>
+          <view
+            class="items"
+            data-sts="3"
+            @tap="toOrderListPage"
+          >
+            <image src="@/static/images/icon/toTake.png" />
+            <text>待收货</text>
+            <text
+              v-if="orderAmount.consignment>0"
+              class="num-badge"
+            >
+              {{ orderAmount.consignment }}
+            </text>
+          </view>
+          <view
+            class="items"
+            data-sts="5"
+            @tap="toOrderListPage"
+          >
+            <image src="@/static/images/icon/toComment.png" />
+            <text>已完成</text>
+          </view>
+        </view>
+      </view>
+      <!--end 订单状态 -->
+
+      <view class="prod-col">
+        <view
+          class="col-item"
+          @tap="myCollectionHandle"
+        >
+          <view
+            v-if="loginResult"
+            class="num"
+          >
+            {{ collectionCount }}
+          </view>
+          <view
+            v-else
+            class="num"
+          >
+            --
+          </view>
+          <view class="tit">
+            我的收藏
+          </view>
+        </view>
+        <view
+          class="col-item"
+          @tap="handleTips"
+        >
+          <view
+            v-if="loginResult"
+            class="num"
+          >
+            5
+          </view>
+          <view
+            v-else
+            class="num"
+          >
+            --
+          </view>
+          <view class="tit">
+            我的消息
+          </view>
+        </view>
+        <view
+          class="col-item"
+          @tap="handleTips"
+        >
+          <view
+            v-if="loginResult"
+            class="num"
+          >
+            3
+          </view>
+          <view
+            v-else
+            class="num"
+          >
+            --
+          </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" />
+            <text>分销中心</text>
+          </view>
+          <view class="arrowhead" />
+        </view>
+        <view
+          class="memu-item"
+          @tap="toCouponCenter"
+        >
+          <view class="i-name">
+            <image src="@/static/images/icon/getCoupon.png" />
+            <text>领券中心</text>
+          </view>
+          <view class="arrowhead" />
+        </view>
+        <view
+          class="memu-item"
+          @tap="toMyCouponPage"
+        >
+          <view class="i-name">
+            <image src="@/static/images/icon/myCoupon.png" />
+            <text>我的优惠券</text>
+          </view>
+          <view class="arrowhead" />
+        </view>
+        <view
+          class="memu-item"
+          @tap="toAddressList"
+        >
+          <view class="i-name">
+            <image src="@/static/images/icon/myAddr.png" />
+            <text>收货地址</text>
+          </view>
+          <view class="arrowhead" />
+        </view>
+      </view>
+      <!--end 列表项 -->
+
+      <view
+        v-if="isAuthInfo"
+        class="log-out"
+        @tap="logout"
+      >
+        <view class="log-out-n">
+          <text>退出登录</text>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+const picDomain = import.meta.env.VITE_APP_RESOURCES_URL
+
+const isAuthInfo = ref(false)
+const loginResult = ref('')
+const orderAmount = ref('')
+/**
+ * 生命周期函数--监听页面显示
+ */
+onShow(() => {
+  loginResult.value = uni.getStorageSync('loginResult')
+  isAuthInfo.value = !!loginResult.value
+  // 加载订单数字
+  if (isAuthInfo.value) {
+    uni.showLoading()
+    http.request({
+      url: '/p/myOrder/orderCount',
+      method: 'GET',
+      data: {}
+    })
+      .then(({ data }) => {
+        uni.hideLoading()
+        orderAmount.value = data
+      })
+    showCollectionCount()
+  }
+})
+
+const toDistCenter = () => {
+  uni.showToast({
+    icon: 'none',
+    title: '该功能未开源'
+  })
+}
+const toCouponCenter = () => {
+  uni.showToast({
+    icon: 'none',
+    title: '该功能未开源'
+  })
+}
+const toMyCouponPage = () => {
+  uni.showToast({
+    icon: 'none',
+    title: '该功能未开源'
+  })
+}
+const handleTips = () => {
+  uni.showToast({
+    icon: 'none',
+    title: '该功能未开源'
+  })
+}
+const toAddressList = () => {
+  uni.navigateTo({
+    url: '/pages/delivery-address/delivery-address'
+  })
+}
+
+const toOrderListPage = (e) => {
+  const sts = e.currentTarget.dataset.sts
+  uni.navigateTo({
+    url: '/pages/orderList/orderList?sts=' + sts
+  })
+}
+
+const collectionCount = ref(0)
+/**
+ * 查询所有的收藏量
+ */
+const showCollectionCount = () => {
+  uni.showLoading()
+  http.request({
+    url: '/p/user/collection/count',
+    method: 'GET',
+    data: {}
+  })
+    .then(({ data }) => {
+      uni.hideLoading()
+      collectionCount.value = data
+    })
+}
+
+/**
+ * 我的收藏跳转
+ */
+const myCollectionHandle = () => {
+  let url = '/pages/prod-classify/prod-classify?sts=5'
+  const id = 0
+  const title = '我的收藏商品'
+  if (id) {
+    url += '&tagid=' + id + '&title=' + title
+  }
+  uni.navigateTo({
+    url
+  })
+}
+
+/**
+ * 去登陆
+ */
+const toLogin = () => {
+  uni.navigateTo({
+    url: '/pages/accountLogin/accountLogin'
+  })
+}
+
+/**
+ * 退出登录
+ */
+const logout = () => {
+  http.request({
+    url: '/logOut',
+    method: 'post'
+  })
+    .then(() => {
+      util.removeTabBadge()
+      uni.removeStorageSync('loginResult')
+      uni.removeStorageSync('token')
+      uni.showToast({
+        title: '退出成功',
+        icon: 'none'
+      })
+      orderAmount.value = ''
+      setTimeout(() => {
+        uni.switchTab({
+          url: '/pages/index/index'
+        })
+      }, 1000)
+    })
+}
+</script>
+
+<style scoped lang="scss">
+@use './user.scss';
+</style>