mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git
synced 2025-12-18 17:05:54 +08:00
Compare commits
254 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
fa8aa633bf | ||
|
|
dca8ee512f | ||
|
|
50c3fd6af8 | ||
|
|
bb93be2fb1 | ||
|
|
17a4131bf1 | ||
|
|
eb9c999a16 | ||
|
|
a70c741990 | ||
|
|
6007dc57d5 | ||
|
|
7dfdb4f685 | ||
|
|
0cc27f4e60 | ||
|
|
163f9f26c2 | ||
|
|
68ba97e590 | ||
|
|
d36c2bdc3d | ||
|
|
72c64f017f | ||
|
|
0f28a7f16c | ||
|
|
581a1f75e1 | ||
|
|
a727001daf | ||
|
|
2f9754b2a5 | ||
|
|
a11452a430 | ||
|
|
7d90846960 | ||
|
|
23e456d265 | ||
|
|
cddd94b9e5 | ||
|
|
685ec5f679 | ||
|
|
0933f1942e | ||
|
|
2792df38c0 | ||
|
|
62d8d121c6 | ||
|
|
b99db4c673 | ||
|
|
3639804d1b | ||
|
|
f6ff0b8a12 | ||
|
|
a345586b25 | ||
|
|
3d0ba486df | ||
|
|
4651d74b7b | ||
|
|
55aa57d812 | ||
|
|
36c4584970 | ||
|
|
96b6565272 | ||
|
|
8b22b73f3d | ||
|
|
ba91d7c26d | ||
|
|
fd847944b7 | ||
|
|
4ea142ea08 | ||
|
|
2aceffc112 | ||
|
|
ed59b389a5 | ||
|
|
2b433cf1e8 | ||
|
|
41ea3b7a88 | ||
|
|
f5a452c124 | ||
|
|
9ce3a5e916 | ||
|
|
248c4031c0 | ||
|
|
8715066f7c | ||
|
|
5dc5cce96b | ||
|
|
f58500c4e3 | ||
|
|
2041eca723 | ||
|
|
db6e47fa04 | ||
|
|
116c168ed7 | ||
|
|
8ff6c0414a | ||
|
|
aaf1c172de | ||
|
|
f7c310b126 | ||
|
|
ab0db38eb2 | ||
|
|
283f4d6afa | ||
|
|
db51df89f7 | ||
|
|
b77b4c0ef8 | ||
|
|
dd67687d3a | ||
|
|
61f5dde015 | ||
|
|
0355dcddde | ||
|
|
1d6a61d5d9 | ||
|
|
bf393181b8 | ||
|
|
79ff1cecb4 | ||
|
|
0d21c87816 | ||
|
|
c281b0a867 | ||
|
|
bd322709f3 | ||
|
|
bc4f9527d0 | ||
|
|
0b5e7c40b0 | ||
|
|
8d5f4db494 | ||
|
|
4ecb41e9a2 | ||
|
|
dba167738b | ||
|
|
c1853fd4e0 | ||
|
|
75ef173c64 | ||
|
|
752c1086a0 | ||
|
|
6c5994202b | ||
|
|
00e229e7f4 | ||
|
|
4674cfae37 | ||
|
|
eeadfc1db9 | ||
|
|
34788d800e | ||
|
|
954cd1cda9 | ||
|
|
f3ef286aa7 | ||
|
|
7874931b1f | ||
|
|
c3b3e7bb61 | ||
|
|
12839eee8d | ||
|
|
601a2e8d33 | ||
|
|
a3fe3a3743 | ||
|
|
86fa39d7af | ||
|
|
a785718715 | ||
|
|
d4eb17e573 | ||
|
|
994b700892 | ||
|
|
317bf1cd47 | ||
|
|
8327639c23 | ||
|
|
c1830df1a2 | ||
|
|
590ceaf641 | ||
|
|
c7b739e546 | ||
|
|
42db858d61 | ||
|
|
85349a197f | ||
|
|
8ef3510c4b | ||
|
|
8d6fa2f19f | ||
|
|
af975b9f46 | ||
|
|
3de928ee14 | ||
|
|
0a5563e5e2 | ||
|
|
f4b7068cd6 | ||
|
|
2cb6f04465 | ||
|
|
037a307ed1 | ||
|
|
cd81a6afb1 | ||
|
|
f930d73a6a | ||
|
|
23bae9efd5 | ||
|
|
2880c21a26 | ||
|
|
274ac3f155 | ||
|
|
c85d488de4 | ||
|
|
92d58ea7e5 | ||
|
|
9a3d202524 | ||
|
|
ba71eaeaaf | ||
|
|
273fdf2e84 | ||
|
|
59cfa0efb0 | ||
|
|
14d720beed | ||
|
|
2dcfacd431 | ||
|
|
71690cfd8f | ||
|
|
d2c2da25b4 | ||
|
|
c3c29af8c7 | ||
|
|
e5f9f81ef7 | ||
|
|
0c0c903529 | ||
|
|
115fa87ff2 | ||
|
|
bb40364aed | ||
|
|
0e921de6c3 | ||
|
|
58eeed4bbd | ||
|
|
21289f5a92 | ||
|
|
0aec486291 | ||
|
|
5c34245ba4 | ||
|
|
3d0a202cbe | ||
|
|
66143deb0d | ||
|
|
2111020f62 | ||
|
|
160658cfb6 | ||
|
|
8a7f9b2487 | ||
|
|
85061ed2f8 | ||
|
|
3405cf68bb | ||
|
|
ebacb58049 | ||
|
|
8873f575db | ||
|
|
994ef217ac | ||
|
|
1bda042bc9 | ||
|
|
e97dbe1c90 | ||
|
|
f19071542a | ||
|
|
50836e0aa3 | ||
|
|
1b4c05f70b | ||
|
|
32dffe96ed | ||
|
|
e2df32d906 | ||
|
|
9eab3b261e | ||
|
|
1e40e2d557 | ||
|
|
256ada983b | ||
|
|
cd0c90ace8 | ||
|
|
913b96af5a | ||
|
|
a3f5212bbc | ||
|
|
9d7a06e867 | ||
|
|
48f3c38fbd | ||
|
|
706bab7eff | ||
|
|
b6fa3175c6 | ||
|
|
3cd57a6915 | ||
|
|
d433ff02cb | ||
|
|
68d2c25ff5 | ||
|
|
9ccf51dd5c | ||
|
|
727d240715 | ||
|
|
1f4448ba08 | ||
|
|
6064c168bf | ||
|
|
479470832d | ||
|
|
71fa00c267 | ||
|
|
c1331e8ccf | ||
|
|
8a2ec77c84 | ||
|
|
b197cda548 | ||
|
|
c83eddd62e | ||
|
|
46168a037d | ||
|
|
cbb2365ae8 | ||
|
|
ec3093246a | ||
|
|
670ba74044 | ||
|
|
84e0803558 | ||
|
|
1691f8244f | ||
|
|
24f4a36082 | ||
|
|
7cf7123dd2 | ||
|
|
37064141c2 | ||
|
|
5bd66b9ec6 | ||
|
|
9e34b44165 | ||
|
|
8d9a64d84b | ||
|
|
92aafe3031 | ||
|
|
81f4f4a742 | ||
|
|
9b14cd633e | ||
|
|
118aaaf6fb | ||
|
|
0635dd38a2 | ||
|
|
1d648bbad7 | ||
|
|
5dfcc2482c | ||
|
|
7ff51b5e53 | ||
|
|
c4168c9a2b | ||
|
|
7312b3ec3f | ||
|
|
c09e25974f | ||
|
|
744567e8de | ||
|
|
4156d51d78 | ||
|
|
0faae31b2e | ||
|
|
79a719e7ff | ||
|
|
0d09920314 | ||
|
|
d641123987 | ||
|
|
ce871a804c | ||
|
|
36fd58a446 | ||
|
|
9e0a681e01 | ||
|
|
df408e640a | ||
|
|
f365231ee7 | ||
|
|
2e8d124560 | ||
|
|
1e8279c849 | ||
|
|
48668fd2d4 | ||
|
|
ee5539fb0f | ||
|
|
97d88abf80 | ||
|
|
9a33db76e9 | ||
|
|
65aa9d0a9f | ||
|
|
baaeef0978 | ||
|
|
e27070e089 | ||
|
|
2ea2723aed | ||
|
|
5188bba5b1 | ||
|
|
33bb16a0d3 | ||
|
|
87f6b81e37 | ||
|
|
3b4f0b8c9d | ||
|
|
3b540b1aac | ||
|
|
378ac39315 | ||
|
|
2dac958227 | ||
|
|
c879cb2af0 | ||
|
|
32336decc6 | ||
|
|
7cd64553ab | ||
|
|
6e737a3fa7 | ||
|
|
25b403cde9 | ||
|
|
535a36c378 | ||
|
|
7b30bc42d7 | ||
|
|
403ae0a963 | ||
|
|
800b91d406 | ||
|
|
bf92b0804e | ||
|
|
7e8ff778f9 | ||
|
|
31f438edfa | ||
|
|
a7ed6454af | ||
|
|
12ea0c2b84 | ||
|
|
44086e8bf4 | ||
|
|
b740a6f906 | ||
|
|
7376d4d890 | ||
|
|
f9d09365ea | ||
|
|
81297db7a8 | ||
|
|
b5ca94ab98 | ||
|
|
a220339fd6 | ||
|
|
0994b6659a | ||
|
|
c4037a346d | ||
|
|
45a6e76d4a | ||
|
|
aee67ec317 | ||
|
|
51610546c4 | ||
|
|
e8e7d27c0d | ||
|
|
166e889b6f | ||
|
|
db95647cd8 | ||
|
|
db13814156 | ||
|
|
5cf3956bc8 |
7
.gitignore
vendored
Normal file
7
.gitignore
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
*/.vscode/
|
||||
/.idea/
|
||||
*/dist/
|
||||
.DS_Store
|
||||
node_modules/
|
||||
yarn.lock
|
||||
package-lock.json
|
||||
17
.idea/codeStyles/Project.xml
generated
17
.idea/codeStyles/Project.xml
generated
@@ -1,17 +0,0 @@
|
||||
<component name="ProjectCodeStyleConfiguration">
|
||||
<code_scheme name="Project" version="173">
|
||||
<option name="OTHER_INDENT_OPTIONS">
|
||||
<value>
|
||||
<option name="INDENT_SIZE" value="2" />
|
||||
<option name="TAB_SIZE" value="2" />
|
||||
</value>
|
||||
</option>
|
||||
<codeStyleSettings language="JavaScript">
|
||||
<indentOptions>
|
||||
<option name="INDENT_SIZE" value="2" />
|
||||
<option name="CONTINUATION_INDENT_SIZE" value="0" />
|
||||
<option name="TAB_SIZE" value="2" />
|
||||
</indentOptions>
|
||||
</codeStyleSettings>
|
||||
</code_scheme>
|
||||
</component>
|
||||
5
.idea/codeStyles/codeStyleConfig.xml
generated
5
.idea/codeStyles/codeStyleConfig.xml
generated
@@ -1,5 +0,0 @@
|
||||
<component name="ProjectCodeStyleConfiguration">
|
||||
<state>
|
||||
<option name="USE_PER_PROJECT_SETTINGS" value="true" />
|
||||
</state>
|
||||
</component>
|
||||
6
.idea/inspectionProfiles/Project_Default.xml
generated
6
.idea/inspectionProfiles/Project_Default.xml
generated
@@ -1,6 +0,0 @@
|
||||
<component name="InspectionProjectProfileManager">
|
||||
<profile version="1.0">
|
||||
<option name="myName" value="Project Default" />
|
||||
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
|
||||
</profile>
|
||||
</component>
|
||||
12
.idea/lili-shop-ui.iml
generated
12
.idea/lili-shop-ui.iml
generated
@@ -1,12 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="WEB_MODULE" version="4">
|
||||
<component name="NewModuleRootManager">
|
||||
<content url="file://$MODULE_DIR$">
|
||||
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/temp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/tmp" />
|
||||
</content>
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
9
.idea/misc.xml
generated
9
.idea/misc.xml
generated
@@ -1,9 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="JavaScriptSettings">
|
||||
<option name="languageLevel" value="ES6" />
|
||||
</component>
|
||||
<component name="WebPackConfiguration">
|
||||
<option name="mode" value="DISABLED" />
|
||||
</component>
|
||||
</project>
|
||||
8
.idea/modules.xml
generated
8
.idea/modules.xml
generated
@@ -1,8 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/lili-shop-ui.iml" filepath="$PROJECT_DIR$/.idea/lili-shop-ui.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
6
.idea/vcs.xml
generated
6
.idea/vcs.xml
generated
@@ -1,6 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="$PROJECT_DIR$" vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
380
.idea/workspace.xml
generated
380
.idea/workspace.xml
generated
@@ -1,380 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="BranchesTreeState">
|
||||
<expand>
|
||||
<path>
|
||||
<item name="ROOT" type="e8cecc67:BranchNodeDescriptor" />
|
||||
<item name="LOCAL_ROOT" type="e8cecc67:BranchNodeDescriptor" />
|
||||
</path>
|
||||
<path>
|
||||
<item name="ROOT" type="e8cecc67:BranchNodeDescriptor" />
|
||||
<item name="REMOTE_ROOT" type="e8cecc67:BranchNodeDescriptor" />
|
||||
</path>
|
||||
<path>
|
||||
<item name="ROOT" type="e8cecc67:BranchNodeDescriptor" />
|
||||
<item name="REMOTE_ROOT" type="e8cecc67:BranchNodeDescriptor" />
|
||||
<item name="GROUP_NODE:origin" type="e8cecc67:BranchNodeDescriptor" />
|
||||
</path>
|
||||
</expand>
|
||||
<select />
|
||||
</component>
|
||||
<component name="ChangeListManager">
|
||||
<list default="true" id="7e964aa0-753b-43f7-854a-2942a3e76fe4" name="默认更改列表" comment="店铺设置">
|
||||
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
|
||||
<<<<<<< HEAD
|
||||
<change beforePath="$PROJECT_DIR$/buyer/src/pages/home/orderCenter/AddAddress.vue" beforeDir="false" afterPath="$PROJECT_DIR$/buyer/src/pages/home/orderCenter/AddAddress.vue" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/manager/src/config/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/manager/src/config/index.js" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/seller/src/config/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/seller/src/config/index.js" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/seller/src/views/statistics/goods/goodsStatistics.vue" beforeDir="false" afterPath="$PROJECT_DIR$/seller/src/views/statistics/goods/goodsStatistics.vue" afterDir="false" />
|
||||
=======
|
||||
<change beforePath="$PROJECT_DIR$/manager/src/views/goods-unit/index.vue" beforeDir="false" afterPath="$PROJECT_DIR$/manager/src/views/goods-unit/index.vue" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/manager/src/views/sensitiveWords/index.vue" beforeDir="false" afterPath="$PROJECT_DIR$/manager/src/views/sensitiveWords/index.vue" afterDir="false" />
|
||||
>>>>>>> new-lmr
|
||||
</list>
|
||||
<option name="SHOW_DIALOG" value="false" />
|
||||
<option name="HIGHLIGHT_CONFLICTS" value="true" />
|
||||
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
|
||||
<option name="LAST_RESOLUTION" value="IGNORE" />
|
||||
</component>
|
||||
<component name="FileTemplateManagerImpl">
|
||||
<option name="RECENT_TEMPLATES">
|
||||
<list>
|
||||
<option value="Vue File" />
|
||||
<option value="Vue Single File Component" />
|
||||
<option value="JavaScript File" />
|
||||
</list>
|
||||
</option>
|
||||
</component>
|
||||
<component name="Git.Settings">
|
||||
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
|
||||
</component>
|
||||
<component name="ProjectId" id="1gGPnr0TWcTGoYhLT7QHFe5MrX4" />
|
||||
<component name="ProjectLevelVcsManager">
|
||||
<ConfirmationsSetting value="2" id="Add" />
|
||||
</component>
|
||||
<component name="ProjectViewState">
|
||||
<option name="hideEmptyMiddlePackages" value="true" />
|
||||
<option name="showLibraryContents" value="true" />
|
||||
</component>
|
||||
<component name="PropertiesComponent">
|
||||
<property name="RunOnceActivity.OpenProjectViewOnStart" value="true" />
|
||||
<property name="RunOnceActivity.ShowReadmeOnStart" value="true" />
|
||||
<property name="SHARE_PROJECT_CONFIGURATION_FILES" value="true" />
|
||||
<property name="WebServerToolWindowFactoryState" value="false" />
|
||||
<<<<<<< HEAD
|
||||
<property name="last_opened_file_path" value="$PROJECT_DIR$/manager/src/api" />
|
||||
=======
|
||||
<property name="last_opened_file_path" value="$PROJECT_DIR$/manager/src/views/sys/setting-manage" />
|
||||
>>>>>>> new-lmr
|
||||
<property name="node.js.detected.package.eslint" value="true" />
|
||||
<property name="node.js.detected.package.tslint" value="true" />
|
||||
<property name="node.js.path.for.package.eslint" value="project" />
|
||||
<property name="node.js.path.for.package.tslint" value="project" />
|
||||
<property name="node.js.selected.package.eslint" value="(autodetect)" />
|
||||
<property name="node.js.selected.package.tslint" value="(autodetect)" />
|
||||
<property name="nodejs_package_manager_path" value="npm" />
|
||||
<property name="settings.editor.selected.configurable" value="preferences.sourceCode.XML" />
|
||||
<property name="ts.external.directory.path" value="$APPLICATION_HOME_DIR$/plugins/JavaScriptLanguage/jsLanguageServicesImpl/external" />
|
||||
</component>
|
||||
<component name="RecentsManager">
|
||||
<key name="CopyFile.RECENT_KEYS">
|
||||
<<<<<<< HEAD
|
||||
<recent name="$PROJECT_DIR$/manager/src/api" />
|
||||
<recent name="$PROJECT_DIR$/manager/src/views/my-components" />
|
||||
=======
|
||||
<recent name="$PROJECT_DIR$/manager/src/views/sys/setting-manage" />
|
||||
>>>>>>> new-lmr
|
||||
<recent name="$PROJECT_DIR$/buyer/src/components/verify" />
|
||||
<recent name="$PROJECT_DIR$/buyer/src/components/change" />
|
||||
</key>
|
||||
<key name="MoveFile.RECENT_KEYS">
|
||||
<recent name="$PROJECT_DIR$/buyer/src/components/change" />
|
||||
<recent name="$PROJECT_DIR$/buyer/src/pages/home/memberCenter" />
|
||||
<recent name="$PROJECT_DIR$/buyer/src/pages/home/orderCenter" />
|
||||
<recent name="$PROJECT_DIR$/buyer/src/pages/home" />
|
||||
<recent name="$PROJECT_DIR$/buyer/src/components/home/order" />
|
||||
</key>
|
||||
</component>
|
||||
<component name="RunManager">
|
||||
<configuration name="Home.vue" type="JavascriptDebugType" temporary="true" nameIsGenerated="true" uri="http://localhost:63342/lili-shop-ui/buyer/src/page/user/Home.vue" useBuiltInWebServerPort="true">
|
||||
<method v="2" />
|
||||
</configuration>
|
||||
<recent_temporary>
|
||||
<list>
|
||||
<item itemvalue="JavaScript Debug.Home.vue" />
|
||||
</list>
|
||||
</recent_temporary>
|
||||
</component>
|
||||
<component name="SvnConfiguration">
|
||||
<configuration />
|
||||
</component>
|
||||
<component name="TaskManager">
|
||||
<task active="true" id="Default" summary="Default task">
|
||||
<changelist id="7e964aa0-753b-43f7-854a-2942a3e76fe4" name="默认更改列表" comment="" />
|
||||
<created>1597738125477</created>
|
||||
<option name="number" value="Default" />
|
||||
<option name="presentableId" value="Default" />
|
||||
<updated>1597738125477</updated>
|
||||
<workItem from="1597738127938" duration="6268000" />
|
||||
<workItem from="1597825716012" duration="3768000" />
|
||||
<workItem from="1597830090678" duration="7632000" />
|
||||
<workItem from="1597972262326" duration="865000" />
|
||||
<workItem from="1597974893526" duration="112000" />
|
||||
<workItem from="1597975021121" duration="17000" />
|
||||
<workItem from="1597975216701" duration="17254000" />
|
||||
<workItem from="1598184961388" duration="14000" />
|
||||
<workItem from="1598233017859" duration="10307000" />
|
||||
<workItem from="1598259954059" duration="2720000" />
|
||||
<workItem from="1598318520176" duration="726000" />
|
||||
<workItem from="1598319433942" duration="106000" />
|
||||
<workItem from="1598319554477" duration="13265000" />
|
||||
<workItem from="1598406300597" duration="6030000" />
|
||||
<workItem from="1598422866858" duration="7787000" />
|
||||
<workItem from="1598491104901" duration="37245000" />
|
||||
<workItem from="1606876680167" duration="61000" />
|
||||
<workItem from="1611131536390" duration="5616000" />
|
||||
<workItem from="1611537245379" duration="828000" />
|
||||
<workItem from="1611538362285" duration="350000" />
|
||||
<workItem from="1611560515629" duration="834000" />
|
||||
<workItem from="1611650051294" duration="3000" />
|
||||
<workItem from="1611818003333" duration="239000" />
|
||||
<workItem from="1613989205923" duration="7005000" />
|
||||
<workItem from="1614076082765" duration="8973000" />
|
||||
<workItem from="1614142479169" duration="2129000" />
|
||||
<workItem from="1614162982178" duration="8343000" />
|
||||
<workItem from="1614228135182" duration="3456000" />
|
||||
<workItem from="1614248866969" duration="8023000" />
|
||||
<workItem from="1614313313338" duration="83000" />
|
||||
<workItem from="1614313447954" duration="211000" />
|
||||
</task>
|
||||
<task id="LOCAL-00001" summary="管理端页面优化">
|
||||
<created>1613996019944</created>
|
||||
<option name="number" value="00001" />
|
||||
<option name="presentableId" value="LOCAL-00001" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1613996019944</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00002" summary="修复修改商家地址报错问题">
|
||||
<created>1613996389449</created>
|
||||
<option name="number" value="00002" />
|
||||
<option name="presentableId" value="LOCAL-00002" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1613996389449</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00003" summary="去掉id">
|
||||
<created>1614076370139</created>
|
||||
<option name="number" value="00003" />
|
||||
<option name="presentableId" value="LOCAL-00003" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614076370139</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00004" summary="选择物流规则不能选择物流模板">
|
||||
<created>1614080544415</created>
|
||||
<option name="number" value="00004" />
|
||||
<option name="presentableId" value="LOCAL-00004" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614080544415</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00005" summary="修改查询条件样式">
|
||||
<created>1614143298555</created>
|
||||
<option name="number" value="00005" />
|
||||
<option name="presentableId" value="LOCAL-00005" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614143298555</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00006" summary="修改样式">
|
||||
<created>1614143902874</created>
|
||||
<option name="number" value="00006" />
|
||||
<option name="presentableId" value="LOCAL-00006" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614143902874</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00007" summary="修改更新时间为NAN">
|
||||
<created>1614144541858</created>
|
||||
<option name="number" value="00007" />
|
||||
<option name="presentableId" value="LOCAL-00007" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614144541858</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00008" summary="修复app版本无法添加和修改">
|
||||
<created>1614230386509</created>
|
||||
<option name="number" value="00008" />
|
||||
<option name="presentableId" value="LOCAL-00008" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614230386509</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00009" summary="去掉打印">
|
||||
<created>1614230407722</created>
|
||||
<option name="number" value="00009" />
|
||||
<option name="presentableId" value="LOCAL-00009" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614230407722</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00010" summary="去掉多选">
|
||||
<created>1614230544808</created>
|
||||
<option name="number" value="00010" />
|
||||
<option name="presentableId" value="LOCAL-00010" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614230544808</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00011" summary="修改消息标题宽度">
|
||||
<created>1614230627881</created>
|
||||
<option name="number" value="00011" />
|
||||
<option name="presentableId" value="LOCAL-00011" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614230627881</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00012" summary="店铺相关js提交">
|
||||
<created>1614231645143</created>
|
||||
<option name="number" value="00012" />
|
||||
<option name="presentableId" value="LOCAL-00012" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614231645143</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00013" summary="店铺修改">
|
||||
<created>1614231785359</created>
|
||||
<option name="number" value="00013" />
|
||||
<option name="presentableId" value="LOCAL-00013" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614231785359</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00014" summary="优化页面">
|
||||
<created>1614249105672</created>
|
||||
<option name="number" value="00014" />
|
||||
<option name="presentableId" value="LOCAL-00014" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614249105672</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00015" summary="页面优化">
|
||||
<created>1614258980903</created>
|
||||
<option name="number" value="00015" />
|
||||
<option name="presentableId" value="LOCAL-00015" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614258980903</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00016" summary="页面优化">
|
||||
<created>1614259068248</created>
|
||||
<option name="number" value="00016" />
|
||||
<option name="presentableId" value="LOCAL-00016" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614259068248</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00017" summary="页面优化">
|
||||
<created>1614313690732</created>
|
||||
<option name="number" value="00017" />
|
||||
<option name="presentableId" value="LOCAL-00017" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1614313690732</updated>
|
||||
</task>
|
||||
<option name="localTasksCounter" value="18" />
|
||||
<servers />
|
||||
</component>
|
||||
<component name="TypeScriptGeneratedFilesManager">
|
||||
<option name="version" value="1" />
|
||||
</component>
|
||||
<component name="Vcs.Log.History.Properties">
|
||||
<option name="COLUMN_ID_ORDER">
|
||||
<list>
|
||||
<option value="Default.Root" />
|
||||
<option value="Default.Author" />
|
||||
<option value="Default.Date" />
|
||||
<option value="Default.Subject" />
|
||||
</list>
|
||||
</option>
|
||||
</component>
|
||||
<component name="Vcs.Log.Tabs.Properties">
|
||||
<option name="TAB_STATES">
|
||||
<map>
|
||||
<entry key="1">
|
||||
<value>
|
||||
<State>
|
||||
<option name="SHOW_ONLY_AFFECTED_CHANGES" value="true" />
|
||||
<option name="FILTERS">
|
||||
<map>
|
||||
<entry key="branch">
|
||||
<value>
|
||||
<list>
|
||||
<option value="HEAD" />
|
||||
</list>
|
||||
</value>
|
||||
</entry>
|
||||
<entry key="structure">
|
||||
<value>
|
||||
<list>
|
||||
<option value="dir:/Users/liushuai/Documents/workspace/lili-shop-ui/seller/src/router" />
|
||||
</list>
|
||||
</value>
|
||||
</entry>
|
||||
</map>
|
||||
</option>
|
||||
</State>
|
||||
</value>
|
||||
</entry>
|
||||
<entry key="MAIN">
|
||||
<value>
|
||||
<State>
|
||||
<option name="COLUMN_ORDER" />
|
||||
</State>
|
||||
</value>
|
||||
</entry>
|
||||
</map>
|
||||
</option>
|
||||
</component>
|
||||
<component name="VcsManagerConfiguration">
|
||||
<MESSAGE value="店铺设置" />
|
||||
<MESSAGE value="文件排序问题处理" />
|
||||
<MESSAGE value="管理端页面优化" />
|
||||
<MESSAGE value="修复修改商家地址报错问题" />
|
||||
<MESSAGE value="去掉id" />
|
||||
<MESSAGE value="选择物流规则不能选择物流模板" />
|
||||
<MESSAGE value="修改查询条件样式" />
|
||||
<MESSAGE value="修改样式" />
|
||||
<MESSAGE value="修改更新时间为NAN" />
|
||||
<MESSAGE value="修复app版本无法添加和修改" />
|
||||
<MESSAGE value="去掉打印" />
|
||||
<MESSAGE value="去掉多选" />
|
||||
<MESSAGE value="修改消息标题宽度" />
|
||||
<MESSAGE value="店铺相关js提交" />
|
||||
<MESSAGE value="店铺修改" />
|
||||
<MESSAGE value="优化页面" />
|
||||
<MESSAGE value="页面优化" />
|
||||
<option name="LAST_COMMIT_MESSAGE" value="页面优化" />
|
||||
</component>
|
||||
<component name="WindowStateProjectService">
|
||||
<state x="2074" y="292" key="CommitChangelistDialog2" timestamp="1614313690605">
|
||||
<screen x="0" y="23" width="3440" height="1333" />
|
||||
</state>
|
||||
<state x="2074" y="292" key="CommitChangelistDialog2/0.23.3440.1333@0.23.3440.1333" timestamp="1614313690605" />
|
||||
<state x="1660" y="123" width="1572" height="1133" key="DiffContextDialog" timestamp="1614231764977">
|
||||
<screen x="0" y="23" width="3440" height="1333" />
|
||||
</state>
|
||||
<state x="1660" y="123" width="1572" height="1133" key="DiffContextDialog/0.23.3440.1333@0.23.3440.1333" timestamp="1614231764977" />
|
||||
<state x="2046" y="418" key="Vcs.Push.Dialog.v2" timestamp="1614313692405">
|
||||
<screen x="0" y="23" width="3440" height="1333" />
|
||||
</state>
|
||||
<state x="2046" y="418" key="Vcs.Push.Dialog.v2/0.23.3440.1333@0.23.3440.1333" timestamp="1614313692405" />
|
||||
<state x="2055" y="414" width="782" height="550" key="find.popup" timestamp="1614256597933">
|
||||
<screen x="0" y="23" width="3440" height="1333" />
|
||||
</state>
|
||||
<state x="2055" y="414" width="782" height="550" key="find.popup/0.23.3440.1333@0.23.3440.1333" timestamp="1614256597933" />
|
||||
<state x="2111" y="325" key="run.anything.popup" timestamp="1613991372498">
|
||||
<screen x="0" y="23" width="3440" height="1333" />
|
||||
</state>
|
||||
<state x="2111" y="325" key="run.anything.popup/0.23.3440.1333@0.23.3440.1333" timestamp="1613991372498" />
|
||||
<state x="2111" y="327" width="670" height="676" key="search.everywhere.popup" timestamp="1614254687317">
|
||||
<screen x="0" y="23" width="3440" height="1333" />
|
||||
</state>
|
||||
<state x="2111" y="327" width="670" height="676" key="search.everywhere.popup/0.23.3440.1333@0.23.3440.1333" timestamp="1614254687317" />
|
||||
</component>
|
||||
<component name="XDebuggerManager">
|
||||
<breakpoint-manager>
|
||||
<breakpoints>
|
||||
<line-breakpoint enabled="true" type="javascript">
|
||||
<url>file://$PROJECT_DIR$/manager/src/views/sys/monitor/monitor.vue</url>
|
||||
<line>5</line>
|
||||
<option name="timeStamp" value="2" />
|
||||
</line-breakpoint>
|
||||
</breakpoints>
|
||||
</breakpoint-manager>
|
||||
</component>
|
||||
</project>
|
||||
179
README.md
179
README.md
@@ -1,18 +1,22 @@
|
||||
## 🔥 Lilishop B2B2C商城系统
|
||||
## Lilishop B2B2C商城系统
|
||||
|
||||
##### 🌹 开源不易,如有帮助请点Star
|
||||
#### 欢迎交流需求,交流业务,交流技术(基础问题自行解决,其他问题先看文档后提问)
|
||||
|
||||
|
||||
|
||||
#### 欢迎交流需求,交流业务,交流技术(基础问题自行解决,进群先看文档后提问)
|
||||
|
||||
##### 交流 qq 1群 961316482(已满)
|
||||
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=BAhURE3DG2YWhQk6kRxVapbLykqMoPS8&jump_from=webapi"><img border="0" src="https://pub.idqqimg.com/wpa/images/group.png" alt="Lilishop交流群" title="Lilishop交流群">点击快捷加群</a>
|
||||
|
||||
##### 交流 qq 2群 875294241
|
||||
##### 交流 qq 2群 875294241(已满)
|
||||
|
||||
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=_lrekOvr5k2p5uTn5GRidI-chKEmpCX3&jump_from=webapi"><img border="0" src="https://pub.idqqimg.com/wpa/images/group.png" alt="Lilishop交流群2群" title="Lilishop交流群2群">点击快捷加群</a>
|
||||
|
||||
|
||||
##### 交流 qq 3群 263785057
|
||||
|
||||
##### 商城 公众号/小程序体验,扫描二维码
|
||||
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=VUogkDvaso4zLTFH8nxFPDRKq0EthUn1&jump_from=webapi"><img border="0" src="//pub.idqqimg.com/wpa/images/group.png" alt="Lilishop交流群3群" title="Lilishop交流群3群">点击快捷加群</a>
|
||||
|
||||
|
||||
##### 体验 公众号/小程序/APP 体验,扫描二维码
|
||||
|
||||

|
||||
|
||||
@@ -20,148 +24,88 @@
|
||||

|
||||
|
||||
|
||||
### 🔥 商城介绍
|
||||
### 商城介绍
|
||||
**官网**:https://pickmall.cn
|
||||
|
||||
Lilishop 商城系统 基于SpringBoot 研发,B2B2C多用户商城系统,前端使用 Vue、uniapp开发 **系统全端全部代码开源**
|
||||
Lilishop商城系统支持商家入驻,后端基于SpringBoot 研发,前端使用 Vue、uniapp开发, **系统全端全部代码开源**
|
||||
|
||||
业务兼容O2O商城/B2B商城/B2B2C商城/F2B2C商城/S2B2C商城。支持小程序商城、H5商城、APP商城、 PC商城。
|
||||
前后端分离,支持分布式部署,支持Docker,各个API独立,并且有独立的消费者。
|
||||
|
||||
### 商城 API/消费者 聚合版
|
||||
api不需要单独部署,只需启动一个jar包就可以正常运转 如有需要,可以点击跳转
|
||||
https://gitee.com/beijing_hongye_huicheng/lilishop-simplify
|
||||
|
||||
商城前后端分离、支持分布式部署。
|
||||
|
||||
商城包含 会员模块、**第三方登录模块**、**第三方支付模块**、**楼层装修模块**、订单模块、分销模块、文章模块、系统设置模块、流量分析模块
|
||||
|
||||
商城包含各种中间件、搜索引擎、多级缓存、分布式事务、分布式任务调度等,支持Docker,支持k8s。是一款高性能,支持高并发的商城系统。
|
||||
|
||||
##### 商城 API/消费者 聚合版
|
||||
api不需要单独部署,只需启动一个jar包就可以正常运转 如有需要,可以点击跳转https://gitee.com/beijing_hongye_huicheng/lilishop-simplify
|
||||
|
||||
### ☃️ 商城 开发/使用/常见问题 帮助文档
|
||||
### 开发/使用/常见问题 帮助文档
|
||||
|
||||
https://docs.pickmall.cn
|
||||
|
||||
### 💧 开源商城项目地址(gitee)
|
||||
### 项目地址
|
||||
|
||||
**API(商城所有API)**:https://gitee.com/beijing_hongye_huicheng/lilishop.git
|
||||
gitee : https://gitee.com/beijing_hongye_huicheng
|
||||
|
||||
**UI(商城管理端/商家端/买家PC端)**: https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git
|
||||
github 镜像: https://github.com/lilishop?tab=repositories
|
||||
|
||||
**uniapp(商城移动端,支持小程序/APP/H5)**:https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git
|
||||
|
||||
**docker一键部署(商城部署脚本)**:https://gitee.com/beijing_hongye_huicheng/docker.git
|
||||
|
||||
### 💧 开源商城项目地址(github)
|
||||
|
||||
**API(商城所有API)**:https://github.com/hongyehuicheng/lilishop.git
|
||||
|
||||
**UI(商城管理端/商家端/买家PC端)**: https://github.com/hongyehuicheng/lilishop-ui.git
|
||||
|
||||
**uniapp(商城移动端,支持小程序/APP/H5)**:https://github.com/hongyehuicheng/lilishop-uniapp.git
|
||||
|
||||
**docker一键部署(商城部署脚本)**:https://github.com/hongyehuicheng/docker.git
|
||||
商城UI 项目下3个文件夹
|
||||
buyer:买家PC端,seller:商家端,manager:后台管理端
|
||||
|
||||
|
||||
☃️ UI 项目下3个文件夹 buyer:买家PC端,seller:商家端,manager:后台管理端
|
||||
### 演示地址
|
||||
PS:手机验证码为 ‘111111’
|
||||
|
||||
**平台管理端**:https://admin-b2b2c.pickmall.cn 账号:admin/123456
|
||||
|
||||
### 💧 演示地址(手机验证码为 ‘111111’)
|
||||
|
||||
**商城管理端**:https://admin-b2b2c.pickmall.cn 账号:admin/123456
|
||||
|
||||
**商城店铺后台**:https://store-b2b2c.pickmall.cn 账号:13011111111/111111
|
||||
**店铺管理端**:https://store-b2b2c.pickmall.cn 账号:13011111111/111111
|
||||
|
||||
**商城PC页面**:https://pc-b2b2c.pickmall.cn
|
||||
|
||||
**商城移动端(请使浏览器手机模式,或者用手机浏览器打开)**:https://m-b2b2c.pickmall.cn
|
||||
|
||||
**小程序/公众号**:扫描二维码
|
||||
**商城 小程序/公众号/APP**:扫描二维码
|
||||
|
||||

|
||||
|
||||
### 🚙 3行命令搭建本地商城(注:只能本机访问,如需调整,请自行操作镜像)
|
||||
### 快速本地部署
|
||||
|
||||
温馨提示:由于服务中间件较多,如果笔记本环境启动内存没有32g可能无法启动成功(macbookpro 2020 16g内存启动无法成功),台式机在16g内存、AMD 3700x 的ubuntu系统成功运行。
|
||||
[点击跳转](https://docs.pickmall.cn/deploy/%E8%BF%90%E8%A1%8C%E7%8E%AF%E5%A2%83%E5%87%86%E5%A4%87.html)
|
||||
|
||||
**商城数据库**
|
||||
使用docker-compose部署数据库,自动初始化数据库,不需要手动下载等操作
|
||||
|
||||
如果手动部署,才需要获取sql [点击跳转](https://gitee.com/beijing_hongye_huicheng/docker/tree/master/init/mysql) (PS:这里有与tag版本一致的sql,如果是历史版本,则docker项目也切换至历史版本获取sql即可,历史版本升级则根据java相聚的根目录DB目录下的升级sql,按需执行)。
|
||||
|
||||
|
||||
|
||||
##### docker环境安装 [点击跳转](https://docs.pickmall.cn/deploy/%E8%BF%90%E8%A1%8C%E7%8E%AF%E5%A2%83%E5%87%86%E5%A4%87.html)
|
||||
### 功能列表
|
||||
|
||||
|
||||
|
||||
##### 下载docker-compose脚本
|
||||
`git clone https://gitee.com/beijing_hongye_huicheng/docker.git `
|
||||
#### 平台管理端功能
|
||||
|
||||
##### 部署商城所需中间件
|
||||
`docker-compose up -d`
|
||||
|
||||
##### 部署商城应用
|
||||
`docker-compose -f docker-compose-application.yml up -d`
|
||||

|
||||
|
||||
|
||||
|
||||
PS:商城数据库单独部署 https://gitee.com/beijing_hongye_huicheng/docker/tree/master/init/mysql 这里有与tag版本一致的sql,根据tag获取sql,如果使用master代码,则需要在lilishop项目根目录的DB目录中,获取对应的升级sql。
|
||||
|
||||
##### 商城 API/UI 地址
|
||||
|
||||
| API | 地址 |
|
||||
| -------------- | --------------- |
|
||||
| 商城买家API | http://127.0.0.1:8888 |
|
||||
| 商城商家API | http://127.0.0.1:8889 |
|
||||
| 商城管理端API | http://127.0.0.1:8887 |
|
||||
| 商城基础API | http://127.0.0.1:8890 |
|
||||
|
||||
| 前端演示 | 地址 |
|
||||
| -------------- | --------------- |
|
||||
| 商城PC端 | http://127.0.0.1:10000 |
|
||||
| 商城WAP端 | http://127.0.0.1:10001 |
|
||||
| 商城卖家端 | http://127.0.0.1:10002 |
|
||||
| 商城管理端 | http://127.0.0.1:10003 |
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
### ⚾️ 功能列表
|
||||
|
||||
|
||||
|
||||
#### 🥎 商城平台功能
|
||||
|
||||

|
||||
|
||||
|
||||
|
||||
#### 🥎 商城卖家功能
|
||||
#### 卖家功能
|
||||
|
||||

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

|
||||
|
||||
|
||||
### 商城技术选型
|
||||
### 技术选型
|
||||
|
||||
#### 🥅 架构图
|
||||
#### 架构图
|
||||
|
||||

|
||||

|
||||
|
||||
##### 🕹 后台技术选型
|
||||
##### 后台技术选型
|
||||
|
||||
| 说明 | 框架 | 说明 | |
|
||||
| -------------- | --------------- | -------------- | ------------- |
|
||||
@@ -175,7 +119,7 @@ PS:商城数据库单独部署 https://gitee.com/beijing_hongye_huicheng/docker/
|
||||
| 短信 | 阿里云短信 | 认证 | JWT |
|
||||
| 日志处理 | Log4j | 接口规范 | RESTful |
|
||||
|
||||
##### 🖥 前端-运营后台、店铺后台
|
||||
##### 前端-运营后台、店铺后台
|
||||
|
||||
| 说明 | 框架 | 说明 | 框架 |
|
||||
| ---------- | ---------- | ---------- | ------- |
|
||||
@@ -185,34 +129,43 @@ PS:商城数据库单独部署 https://gitee.com/beijing_hongye_huicheng/docker/
|
||||
| 基础UI库 | iView | UI界面基于 | iView |
|
||||
| 网络请求 | axios | | |
|
||||
|
||||
##### 📱前端-移动端
|
||||
##### 前端-移动端
|
||||
|
||||
| 说明 | 架构 | 说明 | 架构 |
|
||||
| --------- | ------- | -------- | ------- |
|
||||
| 基础UI库 | uViewui | 基础框架 | uni-app |
|
||||
| CSS预处理 | scss | 地图引擎 | amap |
|
||||
|
||||
### 🌟 版本升级
|
||||
### 版本升级
|
||||
|
||||
```
|
||||
商城后续会持续版本升级,修复bug,完善功能,覆盖更多业务场景 o2o/b2b/s2b2b2c/跨境电商
|
||||
|
||||
后续会考虑推出微服务商城系统/商城中台等
|
||||
系统后续会提供多场景解决方案。
|
||||
更多架构:微服务、Saas、中台等,都会支持。 支持差价升级商业授权
|
||||
```
|
||||
|
||||
### 商业授权
|
||||
商业版本与开源版本代码一致,没有区分
|
||||
|
||||
### ⚠️ 开源须知
|
||||
商业使用需要授权,授权方式可选择联系官网客服,或者qq群联系群主。
|
||||
|
||||
商业授权模式为永久授权,支持永久升级。
|
||||
|
||||
商业案例由于涉及部分多层二开关系,如需了解可以咨询销售。
|
||||
|
||||
|
||||
### 开源须知
|
||||
1.仅允许用于个人学习研究使用.
|
||||
|
||||
2.禁止将本开源的代码和资源进行任何形式任何名义的出售.
|
||||
|
||||
3.软件受国家计算机软件著作权保护(登记号:2021SR0805085)。
|
||||
|
||||
4.限制商用,如果需要商业使用请联系我们。QQ3409056806.
|
||||
4.限制商用,如果需要商业使用请联系我们。QQ3409056806.或者加入qq群联系群主。
|
||||
|
||||
|
||||
### 🐧 交流群
|
||||
|
||||
### 交流群
|
||||
|
||||
##### 官方qq 1群 961316482(已满)
|
||||
##### 官方qq 2群 875294241
|
||||
|
||||
##### 官方qq 2群 875294241(已满)
|
||||
##### 官网qq 3群 263785057
|
||||
|
||||
20
build.sh
Normal file
20
build.sh
Normal file
@@ -0,0 +1,20 @@
|
||||
#代码目录
|
||||
code_path=$PWD
|
||||
|
||||
git checkout master
|
||||
git pull
|
||||
|
||||
cd ${code_path}/manager
|
||||
rm -rf ./dist
|
||||
yarn install
|
||||
yarn build
|
||||
|
||||
cd ${code_path}/seller
|
||||
rm -rf ./dist
|
||||
yarn install
|
||||
yarn build
|
||||
|
||||
cd ${code_path}/buyer
|
||||
rm -rf ./dist
|
||||
yarn install
|
||||
yarn build
|
||||
@@ -1,8 +1,13 @@
|
||||
FROM nginx:alpine
|
||||
FROM node:10.19.0 as build-stage
|
||||
WORKDIR /app
|
||||
COPY package*.json ./
|
||||
RUN npm install
|
||||
COPY . .
|
||||
RUN npm run build
|
||||
|
||||
RUN mkdir -p /app/
|
||||
COPY ./dist /app/
|
||||
# production stage
|
||||
FROM nginx:stable-alpine as production-stage
|
||||
COPY --from=build-stage /app/dist /usr/share/nginx/html
|
||||
COPY ./nginx.conf /etc/nginx/nginx.conf
|
||||
|
||||
|
||||
EXPOSE 80
|
||||
CMD ["nginx", "-g", "daemon off;"]k
|
||||
|
||||
@@ -1 +1 @@
|
||||
docker build -t registry.cn-beijing.aliyuncs.com/lili-images/buyer-ui:4.3.0.1 .
|
||||
docker build -t registry.cn-beijing.aliyuncs.com/lili-images/buyer-ui:4.2.4.1 .
|
||||
|
||||
@@ -1,51 +1,46 @@
|
||||
#这个文件给docker用的
|
||||
#user nobody;
|
||||
worker_processes 1;
|
||||
worker_processes 1;
|
||||
|
||||
#error_log logs/error.log;
|
||||
#error_log logs/error.log notice;
|
||||
#error_log logs/error.log info;
|
||||
|
||||
#pid logs/nginx.pid;
|
||||
|
||||
|
||||
events {
|
||||
worker_connections 1024;
|
||||
worker_connections 1024;
|
||||
}
|
||||
|
||||
|
||||
http {
|
||||
include mime.types;
|
||||
default_type application/octet-stream;
|
||||
include mime.types;
|
||||
default_type application/octet-stream;
|
||||
|
||||
#log_format main '$remote_addr - $remote_user [$time_local] "$request" '
|
||||
# '$status $body_bytes_sent "$http_referer" '
|
||||
# '"$http_user_agent" "$http_x_forwarded_for"';
|
||||
|
||||
#access_log logs/access.log main;
|
||||
|
||||
sendfile on;
|
||||
sendfile on;
|
||||
#tcp_nopush on;
|
||||
|
||||
#keepalive_timeout 0;
|
||||
keepalive_timeout 65;
|
||||
keepalive_timeout 65;
|
||||
client_max_body_size 10m;
|
||||
gzip on;
|
||||
gzip_min_length 5k;
|
||||
gzip_buffers 4 16k;
|
||||
gzip_min_length 5k;
|
||||
gzip_buffers 4 16k;
|
||||
gzip_http_version 1.0;
|
||||
gzip_comp_level 4;
|
||||
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
|
||||
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
|
||||
gzip_vary on;
|
||||
|
||||
server {
|
||||
listen 10000;
|
||||
server_name localhost;
|
||||
listen 10000;
|
||||
|
||||
location / {
|
||||
root /app;
|
||||
try_files $uri $uri/ /index.html $uri/ =404;
|
||||
index index.html index.htm;
|
||||
index index.html index.htm;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
2003
buyer/package-lock.json
generated
2003
buyer/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -3,15 +3,15 @@ var BASE = {
|
||||
* @description api请求基础路径
|
||||
*/
|
||||
API_DEV: {
|
||||
seller: "http://127.0.0.1:8889",
|
||||
manager: "http://127.0.0.1:8887",
|
||||
buyer: "http://127.0.0.1:8888",
|
||||
common: "http://127.0.0.1:8890",
|
||||
common: "http://localhost:8890",
|
||||
buyer: "http://localhost:8888",
|
||||
seller: "http://localhost:8889",
|
||||
manager: "http://localhost:8887"
|
||||
},
|
||||
API_PROD: {
|
||||
common: "https://common-api.pickmall.cn",
|
||||
buyer: "https://buyer-api.pickmall.cn",
|
||||
seller: "https://store-api.pickmall.cn",
|
||||
manager: "https://admin-api.pickmall.cn"
|
||||
common: "http://192.168.2.110:8890",
|
||||
buyer: "http://192.168.2.110:8888",
|
||||
seller: "http://192.168.2.110:8889",
|
||||
manager: "http://192.168.2.110:8887"
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,18 +1,66 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<router-view/>
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import storage from "@/plugins/storage";
|
||||
import { getBaseSite } from "@/api/common.js";
|
||||
export default {
|
||||
name: 'App',
|
||||
name: "App",
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
methods:{
|
||||
init(){
|
||||
if(!storage.getItem("siteName")||!storage.getItem("logoImg")||!storage.getItem("sitelogo_expiration_time")) {
|
||||
this.getSite();
|
||||
}else{
|
||||
// 如果缓存过期,则获取最新的信息
|
||||
if (new Date() > storage.getItem("sitelogo_expiration_time")) {
|
||||
this.getSite();
|
||||
return;
|
||||
}else{
|
||||
window.document.title = storage.getItem("siteName");
|
||||
//动态获取icon
|
||||
let link =document.querySelector("link[rel*='icon']") ||document.createElement("link");
|
||||
link.type = "image/x-icon";
|
||||
link.href = storage.getItem("logoImg");
|
||||
link.rel = "shortcut icon";
|
||||
document.getElementsByTagName("head")[0].appendChild(link);
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
getSite(){
|
||||
//获取基本站点信息
|
||||
getBaseSite().then((res) => {
|
||||
if (res.success && res.result.settingValue) {
|
||||
let data = JSON.parse(res.result.settingValue);
|
||||
// 过期时间
|
||||
var expirationTime = new Date().setHours(new Date().getHours() + 1);
|
||||
// 存放过期时间
|
||||
storage.setItem("sitelogo_expiration_time", expirationTime);
|
||||
// 存放信息
|
||||
storage.setItem('siteName', data.siteName);
|
||||
storage.setItem('logoImg', data.buyerSideLogo);
|
||||
|
||||
window.document.title = data.siteName;
|
||||
//动态获取icon
|
||||
let link =document.querySelector("link[rel*='icon']") ||document.createElement("link");
|
||||
link.type = "image/x-icon";
|
||||
link.href = data.buyerSideLogo;
|
||||
link.rel = "shortcut icon";
|
||||
document.getElementsByTagName("head")[0].appendChild(link);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
#app{
|
||||
#app {
|
||||
@include background_color($light_background_color);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -11,7 +11,7 @@ import request, {Method} from '@/plugins/request.js'
|
||||
// 获取密码状态
|
||||
export function getPwdStatus (params) {
|
||||
return request({
|
||||
url: '/buyer/passport/members/wallet/check',
|
||||
url: '/buyer/passport/member/wallet/check',
|
||||
method: Method.GET,
|
||||
needToken: true,
|
||||
params
|
||||
@@ -21,7 +21,7 @@ export function getPwdStatus (params) {
|
||||
// 设置密码
|
||||
export function setPwd (params) {
|
||||
return request({
|
||||
url: '/buyer/passport/members/wallet/set-password',
|
||||
url: '/buyer/passport/member/wallet/set-password',
|
||||
method: Method.POST,
|
||||
needToken: true,
|
||||
data: params
|
||||
@@ -31,7 +31,7 @@ export function setPwd (params) {
|
||||
// 设置支付密码
|
||||
export function setUpdatePwdOrdinary (params) {
|
||||
return request({
|
||||
url: '/buyer/passport/members/wallet/update-password/ordinary',
|
||||
url: '/buyer/passport/member/wallet/update-password/ordinary',
|
||||
method: Method.GET,
|
||||
needToken: true,
|
||||
data: params
|
||||
@@ -41,7 +41,7 @@ export function setUpdatePwdOrdinary (params) {
|
||||
// 修改会员资料
|
||||
export function editMemberInfo (params) {
|
||||
return request({
|
||||
url: '/buyer/passport/members/editOwn',
|
||||
url: '/buyer/passport/member/editOwn',
|
||||
method: Method.PUT,
|
||||
needToken: true,
|
||||
data: params
|
||||
@@ -51,7 +51,7 @@ export function editMemberInfo (params) {
|
||||
// 修改密码
|
||||
export function editPwd (params) {
|
||||
return request({
|
||||
url: `/buyer/passport/members/modifyPass`,
|
||||
url: `/buyer/passport/member/modifyPass`,
|
||||
method: Method.PUT,
|
||||
needToken: true,
|
||||
data: params
|
||||
@@ -61,7 +61,7 @@ export function editPwd (params) {
|
||||
// 获取密码状态
|
||||
export function logout () {
|
||||
return request({
|
||||
url: '/buyer/passport/members/logout',
|
||||
url: '/buyer/passport/member/logout',
|
||||
method: Method.POST,
|
||||
needToken: true
|
||||
})
|
||||
|
||||
@@ -32,16 +32,7 @@ export function sendSms (params) {
|
||||
params
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 获取logo图标
|
||||
*/
|
||||
export function getLogo () {
|
||||
return request({
|
||||
url: `${commonUrl}/common/logo`,
|
||||
method: Method.GET,
|
||||
needToken: false
|
||||
});
|
||||
}
|
||||
|
||||
// 地区数据,用于三级联动
|
||||
export function getRegion (id) {
|
||||
return request({
|
||||
@@ -88,7 +79,17 @@ export function articleDetail (id) {
|
||||
// 获取IM接口前缀
|
||||
export function getIMDetail () {
|
||||
return request({
|
||||
url: `${commonUrl}/common/IM`,
|
||||
url: `${commonUrl}/common/common/IM`,
|
||||
method: Method.GET
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
//获取图片logo
|
||||
export function getBaseSite(){
|
||||
return request ({
|
||||
url:`${commonUrl}/common/common/site`,
|
||||
method: Method.GET,
|
||||
needToken: false
|
||||
})
|
||||
}
|
||||
|
||||
@@ -1,13 +1,24 @@
|
||||
import request, {Method} from '@/plugins/request.js'
|
||||
import request, { Method } from "@/plugins/request.js";
|
||||
|
||||
// 获取首页楼层装修数据
|
||||
export function indexData (params) {
|
||||
export function indexData(params) {
|
||||
return request({
|
||||
url: '/buyer/other/pageData/getIndex',
|
||||
url: "/buyer/other/pageData/getIndex",
|
||||
method: Method.GET,
|
||||
needToken: false,
|
||||
params
|
||||
})
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取店铺楼层数据
|
||||
*/
|
||||
export function getFloorStoreData(params) {
|
||||
return request({
|
||||
url: `/buyer/other/pageData?pageClientType=PC`,
|
||||
method: "get",
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -15,21 +26,33 @@ export function indexData (params) {
|
||||
* @param pageClientType 客户端类型,可用值:PC,H5,WECHAT_MP,APP
|
||||
* @param pageType 页面类型,可用值:INDEX,STORE,SPECIAL
|
||||
*/
|
||||
export function pageData (params) {
|
||||
export function pageData(params) {
|
||||
return request({
|
||||
url: `/buyer/other/pageData`,
|
||||
method: Method.GET,
|
||||
needToken: false,
|
||||
params
|
||||
})
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 刷新token
|
||||
*/
|
||||
export function handleRefreshToken (token) {
|
||||
export function handleRefreshToken(token) {
|
||||
return request({
|
||||
url: `/buyer/passport/member/refresh/${token}`,
|
||||
method: Method.GET,
|
||||
needToken: false
|
||||
})
|
||||
needToken: false,
|
||||
});
|
||||
}
|
||||
|
||||
// /**
|
||||
// * 获取店铺楼层数据
|
||||
// */
|
||||
// export function getFloorStoreData(params) {
|
||||
// return request({
|
||||
// url: `/buyer/other/pageData?pageClientType=PC`,
|
||||
// method: "get",
|
||||
// params,
|
||||
// });
|
||||
// }
|
||||
|
||||
@@ -92,3 +92,20 @@ export function resetPassword (params) {
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
export function getSCLoginCode(params) {
|
||||
return request({
|
||||
url: `/buyer/passport/member/pc_session`,
|
||||
method: Method.POST,
|
||||
needToken: false,
|
||||
params
|
||||
});
|
||||
}
|
||||
export function sCLogin(token,params) {
|
||||
return request({
|
||||
url: `/buyer/passport/member/session_login/`+token,
|
||||
method: Method.POST,
|
||||
needToken: false,
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@ import request, {Method} from '@/plugins/request.js';
|
||||
// 查询账户余额
|
||||
export function getMembersWallet () {
|
||||
return request({
|
||||
url: '/buyer/passport/members/wallet',
|
||||
url: '/buyer/wallet/wallet',
|
||||
method: Method.GET,
|
||||
needToken: true
|
||||
});
|
||||
@@ -52,7 +52,7 @@ export function recharge (params) {
|
||||
// 提现
|
||||
export function withdrawalApply (params) {
|
||||
return request({
|
||||
url: '/buyer/passport/members/wallet/withdrawal',
|
||||
url: '/buyer/wallet/wallet/withdrawal',
|
||||
method: Method.POST,
|
||||
needToken: true,
|
||||
data: params
|
||||
@@ -485,7 +485,7 @@ export function delMemberMsg (id) {
|
||||
*/
|
||||
export function getGoodsDistribution (distributionId) {
|
||||
return request({
|
||||
url: `/buyer/distribution/bindingDistribution/${distributionId}`,
|
||||
url: `/buyer/distribution/distribution/bindingDistribution/${distributionId}`,
|
||||
method: Method.GET,
|
||||
needToken: true
|
||||
});
|
||||
|
||||
@@ -53,7 +53,7 @@ export function getDetailById (id) {
|
||||
// 店铺分类
|
||||
export function getCateById (id) {
|
||||
return request({
|
||||
url: `/buyer/goods/store/label/get/${id}`,
|
||||
url: `/buyer/store/store/label/get/${id}`,
|
||||
needToken: true,
|
||||
method: Method.GET
|
||||
})
|
||||
|
||||
@@ -10,7 +10,7 @@ $warning_color: #ff9900;
|
||||
$error_color: #ed3f14;
|
||||
$handle-btn-color: #438cde;
|
||||
|
||||
$theme_color: #ff5c58;
|
||||
$theme_color: #e4393c;
|
||||
|
||||
$border_color: #dddee1;
|
||||
$title_color: #8c8c8c;
|
||||
|
||||
@@ -143,14 +143,18 @@ export default {
|
||||
position: absolute;
|
||||
left: -360px;
|
||||
top: -9px;
|
||||
width: 150px;
|
||||
max-width: 150px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.store-search{
|
||||
width:55.6px;
|
||||
padding: 0 9px;
|
||||
border-radius: 0;
|
||||
border-radius: 3px;
|
||||
&:nth-child(2){
|
||||
margin-left: -5px;
|
||||
width:55px;
|
||||
margin-left: -2px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
.btn-div{
|
||||
|
||||
@@ -190,7 +190,7 @@ export default {
|
||||
this.$router.push('/home/Coupons')
|
||||
},
|
||||
onCancel: () => {
|
||||
if (item.storeId !== 'platform') {
|
||||
if (item.storeId !== '0') {
|
||||
this.$router.push({path: '/merchant', query: {id: item.storeId}})
|
||||
} else {
|
||||
if (item.scopeType === 'PORTION_GOODS_CATEGORY') {
|
||||
@@ -290,7 +290,7 @@ export default {
|
||||
}
|
||||
this.loading = true
|
||||
tracksList(params).then(res => {
|
||||
this.tracksList = res.result
|
||||
this.tracksList = res.result.records
|
||||
this.loading = false
|
||||
}).catch(() => { this.loading = false })
|
||||
}
|
||||
|
||||
@@ -43,7 +43,7 @@
|
||||
{{config.icpCard}}
|
||||
</a>
|
||||
</li>
|
||||
<li v-if="config.icpMessage">
|
||||
<li v-if="config.icpMessage" class="footer-bottmom">
|
||||
<a href="https://beian.miit.gov.cn/" target="_blank">
|
||||
{{config.icpMessage}}
|
||||
</a>
|
||||
@@ -51,7 +51,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="information">
|
||||
<div class="information footer-bottmom">
|
||||
|
||||
<a class="flex " :href="config.company.href">
|
||||
<img class="zhizhao" src="@/assets/images/zhizhao.jpg" mode="" />{{config.company.name}}
|
||||
@@ -173,12 +173,19 @@ export default {
|
||||
cursor: pointer;
|
||||
line-height: 26px;
|
||||
}
|
||||
.servece-type-info li:hover{
|
||||
color:#b8b8be;
|
||||
}
|
||||
.servece-type-info li:first-child {
|
||||
font-size: 16px;
|
||||
line-height: 28px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.servece-type-info li:first-child:hover{
|
||||
// font-size:15px;
|
||||
// font-weight: bold;
|
||||
color:#b8b8be;
|
||||
}
|
||||
.friend-link {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
@@ -207,6 +214,17 @@ export default {
|
||||
padding: 5px 0px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.friend-link-item li:hover{
|
||||
color:#b8b8be;
|
||||
margin-top:-2px;
|
||||
}
|
||||
.footer-bottmom:hover{
|
||||
margin-top:0 !important;
|
||||
}
|
||||
.footer-bottmom>a:hover{
|
||||
color:#e4393c;
|
||||
}
|
||||
.link-item {
|
||||
padding: 0px 8px;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -7,8 +7,18 @@
|
||||
<div class="item-detail-big-img">
|
||||
<pic-zoom :url="imgList[imgIndex].url" :scale="2"></pic-zoom>
|
||||
</div>
|
||||
<div v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'" style="margin-top:10px;rgb(153, 149, 149);">实物商品</div>
|
||||
<div v-else-if="skuDetail.goodsType == 'VIRTUAL_GOODS'" style="margin-top:10px;rgb(153, 149, 149);">虚拟商品</div>
|
||||
<div
|
||||
v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'"
|
||||
style="margin-top:10px;rgb(153, 149, 149);"
|
||||
>
|
||||
实物商品
|
||||
</div>
|
||||
<div
|
||||
v-else-if="skuDetail.goodsType == 'VIRTUAL_GOODS'"
|
||||
style="margin-top:10px;rgb(153, 149, 149);"
|
||||
>
|
||||
虚拟商品
|
||||
</div>
|
||||
<div class="item-detail-img-row">
|
||||
<div
|
||||
class="item-detail-img-small"
|
||||
@@ -22,9 +32,10 @@
|
||||
|
||||
<div class="goodsConfig mt_10">
|
||||
<span @click="collect"
|
||||
><Icon type="ios-heart" :color="isCollected ? '#ed3f14' : '#666'" />{{
|
||||
isCollected ? "已收藏" : "收藏"
|
||||
}}</span
|
||||
><Icon
|
||||
type="ios-heart"
|
||||
:color="isCollected ? '#ed3f14' : '#666'"
|
||||
/>{{ isCollected ? "已收藏" : "收藏" }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@@ -46,9 +57,11 @@
|
||||
<!-- 商品详细 价格、优惠券、促销 -->
|
||||
<div class="item-detail-price-row">
|
||||
<div class="item-price-left">
|
||||
|
||||
<!-- 秒杀价格 -->
|
||||
<div class="item-price-row" v-if="skuDetail.promotionPrice && promotionMap['SECKILL']">
|
||||
<div
|
||||
class="item-price-row"
|
||||
v-if="skuDetail.promotionPrice && promotionMap['SECKILL']"
|
||||
>
|
||||
<p>
|
||||
<span class="item-price-title" v-if="promotionMap['SECKILL']"
|
||||
>秒 杀 价</span
|
||||
@@ -63,34 +76,93 @@
|
||||
</div>
|
||||
<!-- 商品原价 -->
|
||||
<div class="item-price-row" v-else>
|
||||
<p>
|
||||
<span class="item-price-title">价 格</span>
|
||||
<span class="item-price">{{ skuDetail.price | unitPrice("¥") }}</span>
|
||||
</p>
|
||||
<!-- 批发价格 -->
|
||||
<div v-if="wholesaleNum && wholesaleNum.length">
|
||||
<div class="flex">
|
||||
<div class="item-price-title">
|
||||
价 格
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-for="(item, index) in wholesalePrice"
|
||||
:key="index"
|
||||
class="item-price item-num"
|
||||
>
|
||||
{{ item | unitPrice("¥") }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<div class="item-price-title">起 批 量</div>
|
||||
<div
|
||||
v-for="(item, index) in wholesaleNum"
|
||||
:key="index"
|
||||
class="item-num item-price-num"
|
||||
>
|
||||
{{ item }}{{ skuDetail.goodsUnit }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 普通价格 -->
|
||||
<div v-else>
|
||||
<span class="item-price-title"
|
||||
>价 格</span
|
||||
>
|
||||
<span class="item-price">{{
|
||||
skuDetail.price | unitPrice("¥")
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 优惠券展示 -->
|
||||
<div class="item-price-row" v-if="promotionMap['COUPON'].length">
|
||||
<p>
|
||||
<div class="item-price-coupon-row" v-if="promotionMap['COUPON'].length">
|
||||
<p class="Ellipsis">
|
||||
<span class="item-price-title">优 惠 券</span>
|
||||
<span
|
||||
class="item-coupon"
|
||||
v-for="(item, index) in promotionMap['COUPON']"
|
||||
:key="index"
|
||||
@click="receiveCoupon(item.id)"
|
||||
>
|
||||
<span v-if="item.couponType == 'PRICE'"
|
||||
>满{{ item.consumeThreshold }}减{{ item.price }}</span
|
||||
>
|
||||
<span v-if="item.couponType == 'DISCOUNT'"
|
||||
>满{{ item.consumeThreshold }}打{{ item.couponDiscount }}折</span
|
||||
<span>
|
||||
<span
|
||||
class="item-coupon"
|
||||
v-for="(item, index) in promotionMap['COUPON'].slice(0, 6)"
|
||||
:key="index"
|
||||
@click="receiveCoupon(item.id)"
|
||||
>
|
||||
<span v-if="item.couponType == 'PRICE'"
|
||||
>满{{ item.consumeThreshold }}减{{ item.price }}</span
|
||||
>
|
||||
<span v-if="item.couponType == 'DISCOUNT'"
|
||||
>满{{ item.consumeThreshold }}打{{
|
||||
item.couponDiscount
|
||||
}}折</span
|
||||
>
|
||||
</span>
|
||||
</span>
|
||||
|
||||
<div class="dropdown" v-if="promotionMap['COUPON'].length > 6">
|
||||
<span>展开更多</span>
|
||||
<div class="dropdown-content">
|
||||
<span
|
||||
class="item-coupon"
|
||||
v-for="(item, index) in promotionMap['COUPON'].slice(6, promotionMap['COUPON'].length)"
|
||||
:key="index"
|
||||
@click="receiveCoupon(item.id)"
|
||||
>
|
||||
<span v-if="item.couponType == 'PRICE'"
|
||||
>满{{ item.consumeThreshold }}减{{ item.price }}</span
|
||||
>
|
||||
<span v-if="item.couponType == 'DISCOUNT'"
|
||||
>满{{ item.consumeThreshold }}打{{
|
||||
item.couponDiscount
|
||||
}}折</span
|
||||
>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</p>
|
||||
</div>
|
||||
<!-- 满减展示 -->
|
||||
<div class="item-price-row" v-if="promotionMap['FULL_DISCOUNT']">
|
||||
<p>
|
||||
<span class="item-price-title">促 销</span>
|
||||
<span class="item-price-title"
|
||||
>促 销</span
|
||||
>
|
||||
<span class="item-promotion">满减</span>
|
||||
<span
|
||||
class="item-desc-pintuan"
|
||||
@@ -101,7 +173,10 @@
|
||||
>
|
||||
<span
|
||||
class="item-desc-pintuan"
|
||||
v-if="promotionMap['FULL_DISCOUNT'].fullRate"
|
||||
v-if="
|
||||
promotionMap['FULL_DISCOUNT'].fullRate &&
|
||||
promotionMap['FULL_DISCOUNT'].fullRateFlag
|
||||
"
|
||||
>满{{ promotionMap["FULL_DISCOUNT"].fullMoney }}元,立享{{
|
||||
promotionMap["FULL_DISCOUNT"].fullRate
|
||||
}}折</span
|
||||
@@ -113,23 +188,34 @@
|
||||
<div class="item-remarks-sum">
|
||||
<p>累计评价</p>
|
||||
<p>
|
||||
<span class="item-remarks-num">{{ skuDetail.commentNum || 0 }} 条</span>
|
||||
<span class="item-remarks-num"
|
||||
>{{ skuDetail.commentNum || 0 }} 条</span
|
||||
>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 选择颜色 -->
|
||||
<div class="item-select" v-for="(sku, index) in formatList" :key="sku.name">
|
||||
<div
|
||||
class="item-select"
|
||||
v-for="(sku, index) in formatList"
|
||||
:key="sku.name"
|
||||
>
|
||||
<div class="item-select-title">
|
||||
<p>{{ sku.name }}</p>
|
||||
</div>
|
||||
<div class="item-select-column">
|
||||
<div class="item-select-row" v-for="item in sku.values" :key="item.value">
|
||||
<div
|
||||
class="item-select-row"
|
||||
v-for="item in sku.values"
|
||||
:key="item.value"
|
||||
>
|
||||
<div
|
||||
class="item-select-box"
|
||||
@click="select(index, item.value)"
|
||||
:class="{
|
||||
'item-select-box-active': item.value === currentSelceted[index],
|
||||
'item-select-box-active':
|
||||
item.value === currentSelceted[index],
|
||||
}"
|
||||
>
|
||||
<div class="item-select-intro">
|
||||
@@ -158,7 +244,9 @@
|
||||
</div>
|
||||
<div
|
||||
class="item-select"
|
||||
v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS' && skuDetail.weight !== 0"
|
||||
v-if="
|
||||
skuDetail.goodsType !== 'VIRTUAL_GOODS' && skuDetail.weight !== 0
|
||||
"
|
||||
>
|
||||
<div class="item-select-title">
|
||||
<p>重量</p>
|
||||
@@ -224,13 +312,27 @@ export default {
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
detail: {
|
||||
handler(val) {
|
||||
this.skuDetail = val.data;
|
||||
this.wholesaleList = val.wholesaleList;
|
||||
this.swiperGoodsImg();
|
||||
},
|
||||
deep: true,
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
wholesaleList: [],
|
||||
count: 1, // 商品数量
|
||||
imgIndex: 0, // 展示图片下标
|
||||
currentSelceted: [], // 当前商品sku
|
||||
imgList: [{ url: "" }], // 商品图片列表
|
||||
skuDetail: this.detail.data, // sku详情
|
||||
skuDetail: {
|
||||
specList: [],
|
||||
}, // sku详情
|
||||
goodsSpecList: this.detail.specs, // 商品spec
|
||||
promotionMap: {
|
||||
// 活动状态
|
||||
@@ -245,6 +347,22 @@ export default {
|
||||
};
|
||||
},
|
||||
components: { PicZoom, Promotion },
|
||||
computed: {
|
||||
wholesalePrice(key) {
|
||||
return this.wholesaleList.length
|
||||
? this.wholesaleList.map((item) => {
|
||||
return item.price;
|
||||
})
|
||||
: [];
|
||||
},
|
||||
wholesaleNum(key) {
|
||||
return this.wholesaleList.length
|
||||
? this.wholesaleList.map((item) => {
|
||||
return item.num;
|
||||
})
|
||||
: [];
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
select(index, value) {
|
||||
// 选择规格
|
||||
@@ -262,9 +380,9 @@ export default {
|
||||
return i;
|
||||
}
|
||||
});
|
||||
this.$router.push({
|
||||
path: "/goodsDetail",
|
||||
query: { skuId: selectedSkuId.skuId, goodsId: this.skuDetail.goodsId },
|
||||
this.$emit("handleClickSku", {
|
||||
skuId: selectedSkuId.skuId,
|
||||
goodsId: this.skuDetail.goodsId,
|
||||
});
|
||||
},
|
||||
|
||||
@@ -307,7 +425,10 @@ export default {
|
||||
.then((res) => {
|
||||
this.loading1 = false;
|
||||
if (res.success) {
|
||||
this.$router.push({ path: "/pay", query: { way: params.cartType } });
|
||||
this.$router.push({
|
||||
path: "/pay",
|
||||
query: { way: params.cartType },
|
||||
});
|
||||
} else {
|
||||
this.$Message.warning(res.message);
|
||||
}
|
||||
@@ -405,6 +526,13 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
swiperGoodsImg() {
|
||||
this.skuDetail.specList.forEach((e) => {
|
||||
if (e.specName === "images") {
|
||||
this.imgList = e.specImage;
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// 用户登录才会判断是否收藏
|
||||
@@ -415,11 +543,7 @@ export default {
|
||||
}
|
||||
});
|
||||
}
|
||||
this.detail.data.specList.forEach((e) => {
|
||||
if (e.specName === "images") {
|
||||
this.imgList = e.specImage;
|
||||
}
|
||||
});
|
||||
|
||||
this.formatSku(this.goodsSpecList);
|
||||
this.promotion();
|
||||
document.title = this.skuDetail.goodsName;
|
||||
@@ -433,57 +557,24 @@ export default {
|
||||
width: 175px;
|
||||
margin-left: 30px;
|
||||
}
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
.inventory {
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.global_color {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.see-Img {
|
||||
width: 100%;
|
||||
height: 175px;
|
||||
}
|
||||
|
||||
.see-Item {
|
||||
> p {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.Report {
|
||||
color: $theme_color !important;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
@include white_background_color();
|
||||
}
|
||||
.item-sale-flex {
|
||||
width: 29%;
|
||||
padding: 0 3%;
|
||||
|
||||
.item-num {
|
||||
text-align: center;
|
||||
width: 100px;
|
||||
}
|
||||
.item-sale {
|
||||
margin: 10px 0;
|
||||
> h3 {
|
||||
width: 13%;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
line-height: 60px;
|
||||
box-sizing: border-box;
|
||||
border-right: 1px solid $border_color;
|
||||
}
|
||||
height: 60px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid $border_color;
|
||||
background: #f7f7f7;
|
||||
.item-price-num {
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.item-detail-show {
|
||||
@@ -593,14 +684,65 @@ export default {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.item-price-coupon-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 5px 0px;
|
||||
}
|
||||
|
||||
.Ellipsis {
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2; //控制显示几行
|
||||
-webkit-box-orient: vertical; //webbox方向
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.dropdown .item-coupon {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
color: $theme_color;
|
||||
margin: 5px 0;
|
||||
font-size: 12px;
|
||||
background-color: #ffdedf;
|
||||
border: 1px dotted $theme_color;
|
||||
cursor: pointer;
|
||||
|
||||
span {
|
||||
padding: 3px;
|
||||
}
|
||||
}
|
||||
.dropdown-content {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #f9f9f9;
|
||||
min-width: 160px;
|
||||
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
|
||||
padding: 12px 16px;
|
||||
}
|
||||
.dropdown:hover .dropdown-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.item-coupon {
|
||||
margin-right: 5px;
|
||||
padding: 3px;
|
||||
padding: 0 5px;
|
||||
color: $theme_color;
|
||||
font-size: 12px;
|
||||
background-color: #ffdedf;
|
||||
border: 1px dotted $theme_color;
|
||||
cursor: pointer;
|
||||
|
||||
span {
|
||||
padding: 3px;
|
||||
}
|
||||
}
|
||||
.item-promotion {
|
||||
margin-right: 5px;
|
||||
@@ -609,8 +751,17 @@ export default {
|
||||
font-size: 12px;
|
||||
border: 1px solid $theme_color;
|
||||
}
|
||||
|
||||
.item-price-right {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.item-remarks-sum {
|
||||
padding-left: 8px;
|
||||
width: 70px;
|
||||
text-align: center;
|
||||
padding: 0 10px;
|
||||
border-left: 1px solid $border_color;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
<template>
|
||||
<div>
|
||||
<div style="height:auto;">
|
||||
<div class="item-intro-show">
|
||||
<div class="item-intro-detail" ref="itemIntroDetail">
|
||||
<div class="item-intro-nav item-tabs">
|
||||
<Tabs :animated="false" @on-click="tabClick">
|
||||
<TabPane label="商品介绍">
|
||||
<div class="item-intro-img" ref="itemIntroGoods">
|
||||
<div v-html="skuDetail.intro" v-if="skuDetail.intro"></div>
|
||||
<div class="item-intro" v-html="skuDetail.intro" v-if="skuDetail.intro"></div>
|
||||
<div v-else style="margin:20px;">暂无商品介绍</div>
|
||||
</div>
|
||||
</TabPane>
|
||||
@@ -71,7 +71,7 @@
|
||||
</TabPane>
|
||||
<TabPane label="商品参数">
|
||||
<template v-if="detail.goodsParamsDTOList && detail.goodsParamsDTOList.length">
|
||||
<div class="goods-params" v-for="item in detail.goodsParamsDTOList" :key="item.groupId">
|
||||
<div class="goods-params" style="height:inherit;" v-for="item in detail.goodsParamsDTOList" :key="item.groupId">
|
||||
<span class="ml_10">{{item.groupName}}</span>
|
||||
<table class="mb_10" cellpadding='0' cellspacing="0" >
|
||||
<tr v-for="param in item.goodsParamsItemDTOList" :key="param.paramId">
|
||||
@@ -214,12 +214,18 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.item-intro{
|
||||
>img{
|
||||
display:block;
|
||||
}
|
||||
}
|
||||
/***************商品详情介绍和推荐侧边栏开始***************/
|
||||
.item-intro-show{
|
||||
|
||||
width: 1200px;
|
||||
margin: 15px auto;
|
||||
display: flex;
|
||||
overflow-x: hidden;
|
||||
flex-direction: row;
|
||||
|
||||
}
|
||||
@@ -303,6 +309,9 @@ export default {
|
||||
.item-intro-img {
|
||||
width: 100%;
|
||||
min-height: 300px;
|
||||
/deep/ img{
|
||||
margin:0 auto;
|
||||
}
|
||||
}
|
||||
.item-intro-img img{
|
||||
max-width: 1000px;
|
||||
|
||||
@@ -2,92 +2,110 @@
|
||||
<div class="scroll-show">
|
||||
<div class="content clearfix">
|
||||
<cateNav class="cate" :hover="true" :showNavBar="false"></cateNav>
|
||||
<Search class="search-con" :hover="true" :showLogo="false" :showTag="false"></Search>
|
||||
<Icon type="ios-cart-outline" @click="goCartList" class="cart-icon" @mouseenter.native="getCartList" />
|
||||
<i class="cart-badge">{{cartNum < 100 ? cartNum : '99'}}</i>
|
||||
<Search
|
||||
class="search-con"
|
||||
:hover="true"
|
||||
:showLogo="false"
|
||||
:showTag="false"
|
||||
></Search>
|
||||
<Icon
|
||||
type="ios-cart-outline"
|
||||
@click="goCartList"
|
||||
class="cart-icon"
|
||||
@mouseenter.native="getCartList"
|
||||
/>
|
||||
<i class="cart-badge">{{ cartNum < 100 ? cartNum : "99" }}</i>
|
||||
</div>
|
||||
<hr class="hr"/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {cartCount} from '@/api/cart.js'
|
||||
import storage from '@/plugins/storage.js';
|
||||
import { cartCount } from "@/api/cart.js";
|
||||
import storage from "@/plugins/storage.js";
|
||||
export default {
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
userInfo: {} // 用户信息
|
||||
}
|
||||
userInfo: {}, // 用户信息
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
cartNum () { // 购物车商品数量
|
||||
return this.$store.state.cartNum
|
||||
}
|
||||
cartNum() {
|
||||
// 购物车商品数量
|
||||
return this.$store.state.cartNum;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
goCartList () { // 跳转购物车页面
|
||||
goCartList() {
|
||||
// 跳转购物车页面
|
||||
let routerUrl = this.$router.resolve({
|
||||
path: '/cart'
|
||||
})
|
||||
window.open(routerUrl.href, '_blank')
|
||||
path: "/cart",
|
||||
});
|
||||
window.open(routerUrl.href, "_blank");
|
||||
},
|
||||
getCartList () { // 获取购物车列表
|
||||
if (storage.getItem('userInfo')) {
|
||||
cartCount().then(res => {
|
||||
this.$store.commit('SET_CARTNUM', res.result)
|
||||
this.Cookies.setItem('cartNum', res.result)
|
||||
})
|
||||
getCartList() {
|
||||
// 获取购物车列表
|
||||
if (storage.getItem("userInfo")) {
|
||||
cartCount().then((res) => {
|
||||
this.$store.commit("SET_CARTNUM", res.result);
|
||||
this.Cookies.setItem("cartNum", res.result);
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
if (storage.getItem("userInfo")) {
|
||||
this.userInfo = JSON.parse(storage.getItem("userInfo"));
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
if (storage.getItem('userInfo')) {
|
||||
this.userInfo = JSON.parse(storage.getItem('userInfo'));
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content{
|
||||
width: 1200px;
|
||||
height: 40px;
|
||||
margin: 10px auto;
|
||||
position: relative;
|
||||
}
|
||||
.cate {
|
||||
float: left;
|
||||
width: 200px!important;
|
||||
}
|
||||
.search-con{
|
||||
float: left;
|
||||
width: 800px;
|
||||
overflow: hidden;
|
||||
margin-top: -27px;
|
||||
}
|
||||
.cart-icon {
|
||||
width: 30px;
|
||||
float: left;
|
||||
font-size: 25px;
|
||||
margin-top: 8px;
|
||||
color: $theme_color;
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
&:hover{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.cart-badge {
|
||||
position: absolute;
|
||||
font-style: normal;
|
||||
right: 165px;
|
||||
display: block;
|
||||
background-color: $theme_color;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
border-radius: 10px;
|
||||
line-height: 17px;
|
||||
text-align: center;
|
||||
z-index: 5;
|
||||
top: 3px;
|
||||
.hr{
|
||||
height:1px;
|
||||
background:$theme_color;
|
||||
}
|
||||
.content {
|
||||
width: 1200px;
|
||||
height: 40px;
|
||||
margin: 10px auto;
|
||||
position: relative;
|
||||
}
|
||||
.cate {
|
||||
float: left;
|
||||
width: 200px !important;
|
||||
}
|
||||
.search-con {
|
||||
float: left;
|
||||
width: 800px;
|
||||
overflow: hidden;
|
||||
margin-top: -27px;
|
||||
}
|
||||
.cart-icon {
|
||||
width: 30px;
|
||||
float: left;
|
||||
font-size: 25px;
|
||||
margin-top: 8px;
|
||||
color: $theme_color;
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.cart-badge {
|
||||
position: absolute;
|
||||
font-style: normal;
|
||||
right: 165px;
|
||||
display: block;
|
||||
background-color: $theme_color;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
border-radius: 10px;
|
||||
line-height: 17px;
|
||||
text-align: center;
|
||||
z-index: 5;
|
||||
top: 3px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -2,13 +2,19 @@
|
||||
<div class="model-item" v-if="element && element.key">
|
||||
<!-- 轮播图模块,包括个人信息,快捷导航模块 -->
|
||||
<template v-if="element.type == 'carousel'">
|
||||
<model-carousel :data="element" class="mb_20 width_1200_auto"></model-carousel>
|
||||
<model-carousel
|
||||
:data="element"
|
||||
class="mb_20 width_1200_auto"
|
||||
></model-carousel>
|
||||
</template>
|
||||
<template v-if="element.type == 'carousel1'">
|
||||
<model-carousel1 :data="element" class="mb_20"></model-carousel1>
|
||||
</template>
|
||||
<template v-if="element.type == 'carousel2'">
|
||||
<model-carousel2 :data="element" class="mb_20 width_1200_auto"></model-carousel2>
|
||||
<model-carousel2
|
||||
:data="element"
|
||||
class="mb_20 width_1200_auto"
|
||||
></model-carousel2>
|
||||
</template>
|
||||
<!-- 热门广告 -->
|
||||
<template v-if="element.type == 'hotAdvert'">
|
||||
@@ -37,13 +43,16 @@
|
||||
</template>
|
||||
<!-- 限时秒杀 待完善 -->
|
||||
<template v-if="element.type == 'seckill' && element.options.list.length">
|
||||
<seckill :data="element" class="mb_20 width_1200_auto"></seckill>
|
||||
<seckill :data="element" class="mb_20 width_1200_auto"></seckill>
|
||||
</template>
|
||||
<!-- 折扣广告 -->
|
||||
<template v-if="element.type == 'discountAdvert'">
|
||||
<div
|
||||
class="discountAdvert"
|
||||
:style="{'backgroundImage' :'url(' + require('@/assets/images/decorate.png') + ')'}"
|
||||
:style="{
|
||||
backgroundImage:
|
||||
'url(' + require('@/assets/images/decorate.png') + ')',
|
||||
}"
|
||||
>
|
||||
<img
|
||||
@click="linkTo(item.url)"
|
||||
@@ -74,44 +83,53 @@
|
||||
</template>
|
||||
<!-- 新品排行 -->
|
||||
<template v-if="element.type == 'newGoodsSort'">
|
||||
<new-goods-sort :data="element" class="mb_20 width_1200_auto"></new-goods-sort>
|
||||
<new-goods-sort
|
||||
:data="element"
|
||||
class="mb_20 width_1200_auto"
|
||||
></new-goods-sort>
|
||||
</template>
|
||||
<!-- 首页广告 -->
|
||||
<template v-if="element.type == 'firstAdvert'">
|
||||
<first-page-advert :data="element" class="mb_20 width_1200_auto"></first-page-advert>
|
||||
<first-page-advert
|
||||
:data="element"
|
||||
class="mb_20 width_1200_auto"
|
||||
></first-page-advert>
|
||||
</template>
|
||||
<!-- 横幅广告 -->
|
||||
<template v-if="element.type == 'bannerAdvert'">
|
||||
<div style="width:100%; text-align: center;">
|
||||
<img
|
||||
width="1200"
|
||||
class="hover-pointer mb_20"
|
||||
|
||||
@click="linkTo(element.options.url)"
|
||||
:src="element.options.img"
|
||||
alt=""
|
||||
/>
|
||||
<template v-if="element.type == 'bannerAdvert'">
|
||||
<div style="width: 100%; text-align: center">
|
||||
<img
|
||||
width="1200"
|
||||
class="hover-pointer mb_20"
|
||||
@click="linkTo(element.options.url)"
|
||||
:src="element.options.img"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="element.type == 'notEnough'">
|
||||
<not-enough :data="element" class="mb_20 width_1200_auto"></not-enough>
|
||||
<template v-if="element.type == 'notEnough'"
|
||||
>
|
||||
<not-enough
|
||||
:data="element"
|
||||
class="mb_20 width_1200_auto"
|
||||
></not-enough>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ModelCarousel from './modelList/Carousel.vue';
|
||||
import ModelCarousel1 from './modelList/Carousel1.vue';
|
||||
import ModelCarousel2 from './modelList/Carousel2.vue';
|
||||
import FirstPageAdvert from './modelList/FirstPageAdvert.vue';
|
||||
import NewGoodsSort from './modelList/NewGoodsSort.vue';
|
||||
import Recommend from './modelList/Recommend.vue';
|
||||
import NotEnough from './modelList/NotEnough.vue';
|
||||
import Seckill from './modelList/Seckill.vue';
|
||||
import ModelCarousel from "./modelList/Carousel.vue";
|
||||
import ModelCarousel1 from "./modelList/Carousel1.vue";
|
||||
import ModelCarousel2 from "./modelList/Carousel2.vue";
|
||||
import FirstPageAdvert from "./modelList/FirstPageAdvert.vue";
|
||||
import NewGoodsSort from "./modelList/NewGoodsSort.vue";
|
||||
import Recommend from "./modelList/Recommend.vue";
|
||||
import NotEnough from "./modelList/NotEnough.vue";
|
||||
import Seckill from "./modelList/Seckill.vue";
|
||||
|
||||
export default {
|
||||
name: 'modelFormItem',
|
||||
props: ['element', 'select', 'index', 'data'],
|
||||
name: "modelFormItem",
|
||||
props: ["element", "select", "index", "data"],
|
||||
components: {
|
||||
ModelCarousel,
|
||||
ModelCarousel1,
|
||||
@@ -120,18 +138,17 @@ export default {
|
||||
NewGoodsSort,
|
||||
FirstPageAdvert,
|
||||
NotEnough,
|
||||
Seckill
|
||||
Seckill,
|
||||
},
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
showModal: false, // 控制模态框显隐
|
||||
selected: {} // 已选数据
|
||||
selected: {}, // 已选数据
|
||||
};
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
.model-item {
|
||||
position: relative;
|
||||
margin-bottom: 10px;
|
||||
@@ -181,7 +198,7 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.width_1200_auto{
|
||||
.width_1200_auto {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
background-color: #fff;
|
||||
|
||||
@@ -23,12 +23,18 @@
|
||||
<div class="person-msg">
|
||||
<img :src="userInfo.face" v-if="userInfo.face" alt />
|
||||
<Avatar icon="ios-person" class="mb_10" v-else size="80" />
|
||||
<div>Hi,{{ userInfo.nickName || `欢迎来到${config.title}` | secrecyMobile }}</div>
|
||||
<div>
|
||||
Hi, {{
|
||||
userInfo.nickName || `欢迎来到${config.title}` | secrecyMobile
|
||||
}}
|
||||
</div>
|
||||
<div v-if="userInfo.id">
|
||||
<Button type="error" shape="circle" @click="$router.push('home')">会员中心</Button>
|
||||
<Button class="btns" shape="circle" @click="$router.push('home')"
|
||||
>会员中心</Button
|
||||
>
|
||||
</div>
|
||||
<div v-else>
|
||||
<Button type="error" @click="$router.push('login')" shape="circle"
|
||||
<Button class="btns" @click="$router.push('login')" shape="circle"
|
||||
>请登录</Button
|
||||
>
|
||||
</div>
|
||||
@@ -37,8 +43,14 @@
|
||||
<div>
|
||||
<span>常见问题</span>
|
||||
<ul class="article-list">
|
||||
<li class="ellipsis" :alt="article.title" v-for="(article, index) in articleList" :key="index" @click="goArticle(article.id)">
|
||||
{{article.title}}
|
||||
<li
|
||||
class="ellipsis"
|
||||
:alt="article.title"
|
||||
v-for="(article, index) in articleList"
|
||||
:key="index"
|
||||
@click="goArticle(article.id)"
|
||||
>
|
||||
{{ article.title }}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -49,45 +61,48 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import {articleList} from '@/api/common.js'
|
||||
import storage from '@/plugins/storage';
|
||||
import { articleList } from "@/api/common.js";
|
||||
import storage from "@/plugins/storage";
|
||||
export default {
|
||||
name: 'modelCarousel',
|
||||
props: ['data'],
|
||||
data () {
|
||||
name: "modelCarousel",
|
||||
props: ["data"],
|
||||
data() {
|
||||
return {
|
||||
config:require('@/config'),
|
||||
config: require("@/config"),
|
||||
userInfo: {}, // 用户信息
|
||||
articleList: [], // 常见问题
|
||||
params: { // 请求常见问题参数
|
||||
params: {
|
||||
// 请求常见问题参数
|
||||
pageNumber: 1,
|
||||
pageSize: 5,
|
||||
type: 'ANNOUNCEMENT',
|
||||
sort: 'sort'
|
||||
}
|
||||
type: "ANNOUNCEMENT",
|
||||
sort: "sort",
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
getArticleList () { // 获取常见问题列表
|
||||
articleList(this.params).then(res => {
|
||||
getArticleList() {
|
||||
// 获取常见问题列表
|
||||
articleList(this.params).then((res) => {
|
||||
if (res.success) {
|
||||
this.articleList = res.result.records
|
||||
this.articleList = res.result.records;
|
||||
}
|
||||
})
|
||||
},
|
||||
goArticle (id) { // 跳转文章详情
|
||||
let routeUrl = this.$router.resolve({
|
||||
path: '/article',
|
||||
query: {id}
|
||||
});
|
||||
window.open(routeUrl.href, '_blank');
|
||||
}
|
||||
},
|
||||
goArticle(id) {
|
||||
// 跳转文章详情
|
||||
let routeUrl = this.$router.resolve({
|
||||
path: "/article",
|
||||
query: { id },
|
||||
});
|
||||
window.open(routeUrl.href, "_blank");
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
if (storage.getItem("userInfo"))
|
||||
this.userInfo = JSON.parse(storage.getItem("userInfo"));
|
||||
this.getArticleList();
|
||||
},
|
||||
mounted () {
|
||||
if (storage.getItem('userInfo')) this.userInfo = JSON.parse(storage.getItem('userInfo'));
|
||||
this.getArticleList()
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -98,6 +113,16 @@ export default {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.btns {
|
||||
background-color:#363634 ;
|
||||
line-height:30px;
|
||||
color: white !important;
|
||||
}
|
||||
.btns:hover {
|
||||
background-color: #363634;
|
||||
line-height:32px !important;
|
||||
color: #e5d790 !important;
|
||||
}
|
||||
/* 导航主体 */
|
||||
.nav-body {
|
||||
width: 1200px;
|
||||
@@ -130,12 +155,14 @@ export default {
|
||||
flex-direction: column;
|
||||
margin: 20px auto;
|
||||
button {
|
||||
height: 25px !important;
|
||||
height: 30px !important;
|
||||
margin-top: 10px;
|
||||
line-height: 30px;
|
||||
border: none;
|
||||
}
|
||||
.ivu-btn-default {
|
||||
color: $theme_color;
|
||||
border-color: $theme_color;
|
||||
// color: $theme_color;
|
||||
// border-color: $theme_color;
|
||||
}
|
||||
img {
|
||||
margin-bottom: 10px;
|
||||
|
||||
@@ -1,16 +1,18 @@
|
||||
<template>
|
||||
<div class="not-enough">
|
||||
<ul class="nav-bar">
|
||||
<li
|
||||
v-for="(item, index) in conData.options.navList"
|
||||
:class="currentIndex === index ? 'curr' : ''"
|
||||
@click="changeCurr(index)"
|
||||
:key="index"
|
||||
>
|
||||
<p>{{ item.title }}</p>
|
||||
<p>{{ item.desc }}</p>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="not-enough" ref="obtain" id="demo">
|
||||
<Affix :offset-top="62" @on-change="change">
|
||||
<ul class="nav-bar" v-show="topSearchShow">
|
||||
<li
|
||||
v-for="(item, index) in conData.options.navList"
|
||||
:class="currentIndex === index ? 'curr' : ''"
|
||||
@click="changeCurr(index)"
|
||||
:key="index"
|
||||
>
|
||||
<p @click="gotoDemo">{{ item.title }}</p>
|
||||
<p @click="gotoDemo">{{ item.desc }}</p>
|
||||
</li>
|
||||
</ul>
|
||||
</Affix>
|
||||
<div class="content" v-if="showContent">
|
||||
<div
|
||||
v-for="(item, index) in conData.options.list[currentIndex]"
|
||||
@@ -29,17 +31,26 @@
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
mounted() {
|
||||
window.addEventListener('scroll',this.handleScrollx,true)
|
||||
},
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
default: null
|
||||
}
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
screenHeight:document.body.clientHeight,
|
||||
scrollHieght:0,
|
||||
topSearchShow: true, //展示 导航条
|
||||
topIndex: 0, // 当前滚动条位置 (取整)
|
||||
scrollTops: 0,
|
||||
open:'',
|
||||
currentIndex: 0, // 当前分类下标
|
||||
conData: this.data, // 装修数据
|
||||
showContent: true // 是否展示内容
|
||||
showContent: true, // 是否展示内容
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
@@ -47,14 +58,40 @@ export default {
|
||||
this.conData = val;
|
||||
},
|
||||
conData: function (val) {
|
||||
this.$emit('content', val);
|
||||
}
|
||||
this.$emit("content", val);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
changeCurr (index) { // 选择分类
|
||||
this.currentIndex = index;
|
||||
handleScrollx(){
|
||||
// console.log('滚动高度',window.pageYOffset) // 获取滚动条的高度
|
||||
// console.log(this.$refs.obtain.getBoundingClientRect().top) //获取到距离顶部的距离
|
||||
this.scrollHieght = Number(window.pageYOffset);//获取到距离顶部的距离
|
||||
this.scrollTops = Number(this.$refs.obtain.getBoundingClientRect().top); // 获取到距离顶部的距离
|
||||
this.topSearchShow = true; // 展示图钉
|
||||
if(this.scrollTops < -660){ // 超过隐藏
|
||||
this.topSearchShow = false;
|
||||
}
|
||||
},
|
||||
toguid(path,id){
|
||||
var path =path;
|
||||
var Id = id;
|
||||
localStorage.setItem('toId',Id);
|
||||
this.$router.push(path);
|
||||
},
|
||||
change(status){ //获取是否获取到图钉
|
||||
this.open = status
|
||||
},
|
||||
gotoDemo(){ // 跳转到demo的位置
|
||||
if(this.open){ // 获取到图钉之后在跳转当前位置
|
||||
document.querySelector("#demo").scrollIntoView(true);
|
||||
}
|
||||
}
|
||||
//scrollIntoView()可以在所有的HTML元素上调用,通过滚动浏览器窗口或某个容器元素
|
||||
},
|
||||
changeCurr(index) {
|
||||
// 选择分类
|
||||
this.currentIndex = index;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@@ -63,10 +100,13 @@ export default {
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
background-color: #f3f5f7;
|
||||
background-color: #f8f8f8;
|
||||
height: 60px;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
position: sticky;
|
||||
position: -webkit-sticky;
|
||||
top: 0;
|
||||
li {
|
||||
padding: 0 30px;
|
||||
text-align: center;
|
||||
@@ -140,5 +180,6 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -161,7 +161,7 @@ export default {
|
||||
padding: 0 10px;
|
||||
font-size: 12px;
|
||||
>div:nth-child(1) {
|
||||
width: 130px;
|
||||
|
||||
margin-top: 30px;
|
||||
span:nth-child(1){
|
||||
color: #fff;
|
||||
@@ -169,7 +169,7 @@ export default {
|
||||
padding: 0 5px;
|
||||
background-color: #a25684;
|
||||
display: block;
|
||||
width: 120px;
|
||||
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
margin: 0 10px 10px 0;
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="seckill">
|
||||
<div class="seckill" v-if="goodsList.length">
|
||||
<div class="aside hover-pointer" @click="goToSeckill">
|
||||
<div class="title">{{ actName }}</div>
|
||||
<div class="hour">
|
||||
@@ -14,7 +14,7 @@
|
||||
</div>
|
||||
<swiper :options="swiperOption" ref="mySwiper">
|
||||
<swiper-slide v-for="(item,index) in goodsList" :key="index">
|
||||
<div class="content hover-pointer" @click="goToSeckill">
|
||||
<div class="content hover-pointer" @click.stop="goToSeckill">
|
||||
<img :src="item.goodsImage" width="140" height="140" :alt="item.goodsName">
|
||||
<div class="ellipsis">{{item.goodsName}}</div>
|
||||
<div>
|
||||
@@ -58,7 +58,7 @@ export default {
|
||||
seconds: 0, // 秒
|
||||
interval: null, // 定时器
|
||||
swiperOption: { // 轮播图参数
|
||||
loop: true,
|
||||
|
||||
slidesPerView: 5,
|
||||
// 设置点击箭头
|
||||
navigation: {
|
||||
@@ -157,6 +157,7 @@ export default {
|
||||
// ]
|
||||
this.list = this.data.options.list
|
||||
this.goodsList = this.list[0].seckillGoodsList
|
||||
console.log( this.goodsList)
|
||||
this.countDown(this.currIndex)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,28 +1,55 @@
|
||||
<template>
|
||||
<div class="cate-nav">
|
||||
<div class="nav-con">
|
||||
<div class="all-categories hover-pointer" @mouseenter="showFirstList = true" @mouseleave="showFirstList = false">全部商品分类</div>
|
||||
<div
|
||||
class="all-categories hover-pointer"
|
||||
@mouseenter="showFirstLists"
|
||||
@mouseleave="showFirstList = false"
|
||||
>
|
||||
全部商品分类
|
||||
</div>
|
||||
<ul class="nav-item" v-if="showNavBar">
|
||||
<li
|
||||
class ="nav-lis"
|
||||
class="nav-lis"
|
||||
v-for="(item, index) in navList.list"
|
||||
:key="index"
|
||||
@click="linkTo(item.url)"
|
||||
>
|
||||
{{ item.name }}
|
||||
<!-- {{item}} -->
|
||||
</li>
|
||||
</ul>
|
||||
</div> <hr style="width:1200px;height:2px;background:#e4393c;margin-top:-1px;margin-bottom:5px;"/>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- 全部商品分类 -->
|
||||
<div class="cate-list" v-show="showAlways || showFirstList" @mouseenter="showFirstList = true" @mouseleave="showFirstList = false">
|
||||
<div
|
||||
class="cate-list"
|
||||
v-show="showAlways || showFirstList"
|
||||
@mouseenter="showFirstList = true"
|
||||
@mouseleave="showFirstList = false"
|
||||
>
|
||||
<!-- 第一级分类 -->
|
||||
<div class="nav-side" :class="{'large-nav': large, 'opacity-nav': opacity}" @mouseleave="panel = false">
|
||||
<div
|
||||
class="nav-side"
|
||||
:class="{ 'large-nav': large, 'opacity-nav': opacity }"
|
||||
@mouseleave="panel = false"
|
||||
>
|
||||
<ul>
|
||||
<li v-for="(item, index) in cateList" :key="index" @mouseenter="showDetail(index)" >
|
||||
<span class="nav-side-item" @click="goGoodsList(item.id)">{{item.name}}</span>
|
||||
<li
|
||||
v-for="(item, index) in cateList"
|
||||
:key="index"
|
||||
@mouseenter="showDetail(index)"
|
||||
>
|
||||
<span class="nav-side-item" @click="goGoodsList(item.id)">{{
|
||||
item.name
|
||||
}}</span>
|
||||
<span v-for="(second, secIndex) in item.children" :key="secIndex">
|
||||
<span v-if="secIndex < 2" > / </span>
|
||||
<span @click="goGoodsList(second.id, second.parentId)" class="nav-side-item" v-if="secIndex < 2">{{second.name}}</span>
|
||||
<span v-if="secIndex < 2"> / </span>
|
||||
<span
|
||||
@click="goGoodsList(second.id, second.parentId)"
|
||||
class="nav-side-item"
|
||||
v-if="secIndex < 2"
|
||||
>{{ second.name }}</span
|
||||
>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -30,14 +57,19 @@
|
||||
<!-- 展开分类 -->
|
||||
<div
|
||||
class="detail-item-panel"
|
||||
:style="{'minHeight': large?'470px':'340px'}"
|
||||
:style="{ minHeight: large ? '470px' : '340px' }"
|
||||
v-show="panel"
|
||||
@mouseenter="panel = true"
|
||||
@mouseleave="panel = false"
|
||||
>
|
||||
<div class="nav-detail-item">
|
||||
<template v-for="(item, index) in panelData">
|
||||
<span @click="goGoodsList(item.id, item.parentId)" v-if="index < 8" :key="index">{{ item.name }}<Icon type="ios-arrow-forward" /></span>
|
||||
<template v-for="(item,index) in panelData">
|
||||
<span
|
||||
@click="goGoodsList(item.id,item.parentId)"
|
||||
v-if="index < 8"
|
||||
:key="index"
|
||||
>{{ item.name }}<Icon type="ios-arrow-forward"
|
||||
/></span>
|
||||
</template>
|
||||
</div>
|
||||
<ul>
|
||||
@@ -46,13 +78,21 @@
|
||||
:key="index"
|
||||
class="detail-item-row"
|
||||
>
|
||||
<span class="detail-item-title" @click="goGoodsList(items.id,items.parentId)">
|
||||
<span
|
||||
class="detail-item-title"
|
||||
@click="goGoodsList(items.id, items.parentId)"
|
||||
>
|
||||
{{ items.name }} <Icon type="ios-arrow-forward" />
|
||||
<span class="glyphicon glyphicon-menu-right"></span>
|
||||
</span>
|
||||
<div>
|
||||
<span v-for="(item, subIndex) in items.children" @click="goGoodsList(item.id,items.id,items.parentId)"
|
||||
:key="subIndex" class="detail-item">{{ item.name }}</span>
|
||||
<span
|
||||
v-for="(item, subIndex) in items.children"
|
||||
@click="goGoodsList(item.id, items.id, items.parentId)"
|
||||
:key="subIndex"
|
||||
class="detail-item"
|
||||
>{{ item.name }}</span
|
||||
>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -62,105 +102,132 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getCategory } from '@/api/goods';
|
||||
import storage from '@/plugins/storage.js'
|
||||
import { getCategory } from "@/api/goods";
|
||||
import storage from "@/plugins/storage.js";
|
||||
export default {
|
||||
name: 'GoodsListNav',
|
||||
name: "GoodsListNav",
|
||||
props: {
|
||||
showAlways: { // 总是显示下拉分类
|
||||
showAlways: {
|
||||
// 总是显示下拉分类
|
||||
default: false,
|
||||
type: Boolean
|
||||
type: Boolean,
|
||||
},
|
||||
showNavBar: { // 显示全部商品分类右侧导航条
|
||||
showNavBar: {
|
||||
// 显示全部商品分类右侧导航条
|
||||
default: true,
|
||||
type: Boolean
|
||||
type: Boolean,
|
||||
},
|
||||
hover: {
|
||||
default: false,
|
||||
type: Boolean
|
||||
type: Boolean,
|
||||
},
|
||||
large: { // 是否更高的高度
|
||||
large: {
|
||||
// 是否更高的高度
|
||||
default: false,
|
||||
type: Boolean
|
||||
type: Boolean,
|
||||
},
|
||||
opacity: { // 是否背景透明
|
||||
opacity: {
|
||||
// 是否背景透明
|
||||
default: false,
|
||||
type: Boolean
|
||||
}
|
||||
type: Boolean,
|
||||
},
|
||||
},
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
panel: false, // 二级分类展示
|
||||
panelData: [], // 二级分类数据
|
||||
showFirstList: false, // 始终展示一级列表
|
||||
cateList: [] // 商品分类
|
||||
}
|
||||
cateList: [], // 商品分类
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
navList () { // 导航列表
|
||||
if (storage.getItem('navList')) {
|
||||
return JSON.parse(storage.getItem('navList'))
|
||||
navList() {
|
||||
// 导航列表
|
||||
if (storage.getItem("navList")) {
|
||||
return JSON.parse(storage.getItem("navList"));
|
||||
} else {
|
||||
return []
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getCate () { // 获取分类数据
|
||||
if (this.hover) return false;
|
||||
getCategory(0).then(res => {
|
||||
if (res.success) {
|
||||
this.cateList = res.result;
|
||||
this.$store.commit('SET_CATEGORY', res.result)
|
||||
// 过期时间
|
||||
var expirationTime = new Date().setHours(new Date().getHours() + 1);
|
||||
// 存放过期时间
|
||||
localStorage.setItem('category_expiration_time', expirationTime);
|
||||
// 存放分类信息
|
||||
localStorage.setItem('category', JSON.stringify(res.result))
|
||||
}
|
||||
});
|
||||
},
|
||||
showDetail (index) { // 展示全部分类
|
||||
this.panel = true
|
||||
this.panelData = this.cateList[index].children
|
||||
},
|
||||
goGoodsList (id, secondId, firstId) { // 分类共有三级,传全部分类过去
|
||||
const arr = [firstId, secondId, id]
|
||||
if (!arr[1]) {
|
||||
arr.splice(0, 2)
|
||||
}
|
||||
if (!arr[0]) {
|
||||
arr.shift()
|
||||
}
|
||||
let routerUrl = this.$router.resolve({
|
||||
path: '/goodsList',
|
||||
query: {categoryId: arr.toString()}
|
||||
})
|
||||
window.open(routerUrl.href, '_blank')
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
if (localStorage.getItem('category') && localStorage.getItem('category_expiration_time')) {
|
||||
showFirstLists(){
|
||||
this.showFirstList = true;
|
||||
if(
|
||||
localStorage.getItem("category") &&
|
||||
localStorage.getItem("category_expiration_time")
|
||||
) {
|
||||
// this.getCate();
|
||||
// 如果缓存过期,则获取最新的信息
|
||||
if (new Date() > localStorage.getItem('category_expiration_time')) {
|
||||
if (new Date() > localStorage.getItem("category_expiration_time")) {
|
||||
this.getCate();
|
||||
return;
|
||||
}
|
||||
this.cateList = JSON.parse(localStorage.getItem('category'))
|
||||
this.cateList = JSON.parse(localStorage.getItem("category"));
|
||||
// this.$Message.info(cateList)
|
||||
}
|
||||
},
|
||||
getCate() {
|
||||
// 获取分类数据
|
||||
if (this.hover) return false;
|
||||
getCategory(0).then((res) => {
|
||||
if (res.success) {
|
||||
this.cateList = res.result;
|
||||
this.$store.commit("SET_CATEGORY", res.result);
|
||||
// 过期时间
|
||||
var expirationTime = new Date().setHours(new Date().getHours() + 1);
|
||||
// 存放过期时间
|
||||
localStorage.setItem("category_expiration_time", expirationTime);
|
||||
// 存放分类信息
|
||||
localStorage.setItem("category", JSON.stringify(res.result));
|
||||
}
|
||||
});
|
||||
},
|
||||
showDetail(index) {
|
||||
// 展示全部分类
|
||||
this.panel = true;
|
||||
this.panelData = this.cateList[index].children;
|
||||
},
|
||||
goGoodsList(id, secondId, firstId) {
|
||||
// 分类共有三级,传全部分类过去
|
||||
const arr = [firstId, secondId, id];
|
||||
if (!arr[1]) {
|
||||
arr.splice(0, 2);
|
||||
}
|
||||
if (!arr[0]) {
|
||||
arr.shift();
|
||||
}
|
||||
let routerUrl = this.$router.resolve({
|
||||
path: "/goodsList",
|
||||
query: { categoryId: arr.toString() },
|
||||
});
|
||||
window.open(routerUrl.href, "_blank");
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
if (
|
||||
localStorage.getItem("category") &&
|
||||
localStorage.getItem("category_expiration_time")
|
||||
) {
|
||||
// 如果缓存过期,则获取最新的信息
|
||||
if (new Date() > localStorage.getItem("category_expiration_time")) {
|
||||
this.getCate();
|
||||
return;
|
||||
}
|
||||
this.cateList = JSON.parse(localStorage.getItem("category"));
|
||||
} else {
|
||||
this.getCate()
|
||||
this.getCate();
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.nav-lis:hover{
|
||||
color:#e4393c !important;
|
||||
.nav-lis:hover {
|
||||
color: $theme_color !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
.cate-nav{
|
||||
.cate-nav {
|
||||
width: 1200px;
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
@@ -175,10 +242,10 @@ export default {
|
||||
width: 200px;
|
||||
line-height: 40px;
|
||||
color: #fff;
|
||||
background-color: #e4393c;
|
||||
background-color: $theme_color;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
border-bottom:none;
|
||||
border-bottom: none;
|
||||
}
|
||||
.nav-item {
|
||||
width: 1000px;
|
||||
@@ -195,13 +262,13 @@ export default {
|
||||
color: rgb(129, 127, 127);
|
||||
font-size: 15px;
|
||||
&:hover {
|
||||
color: $theme_color;
|
||||
color: #e1251b;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// 分类列表
|
||||
.cate-list{
|
||||
.cate-list {
|
||||
margin: 0 auto;
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
@@ -216,14 +283,14 @@ export default {
|
||||
height: 335px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.large-nav{
|
||||
.large-nav {
|
||||
height: 470px;
|
||||
ul>li{
|
||||
ul > li {
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
.opacity-nav{
|
||||
background-color:rgba(0,0,0,.5);
|
||||
.opacity-nav {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
.nav-side ul {
|
||||
width: 100%;
|
||||
@@ -236,13 +303,13 @@ export default {
|
||||
padding-left: 12px;
|
||||
font-size: 13px;
|
||||
line-height: 18px;
|
||||
&:hover{
|
||||
&:hover {
|
||||
background: #999395;
|
||||
}
|
||||
}
|
||||
.nav-side-item:hover {
|
||||
cursor: pointer;
|
||||
color: $theme_color;
|
||||
color: #e1251b;
|
||||
}
|
||||
|
||||
/*显示商品详细信息*/
|
||||
@@ -271,7 +338,7 @@ export default {
|
||||
background-color: #6e6568;
|
||||
}
|
||||
.nav-detail-item span:hover {
|
||||
background-color: $theme_color;
|
||||
background-color: #e1251b;
|
||||
}
|
||||
.detail-item-panel li {
|
||||
line-height: 30px;
|
||||
@@ -286,11 +353,13 @@ export default {
|
||||
text-align: right;
|
||||
}
|
||||
.detail-item-title:hover {
|
||||
color: $theme_color;
|
||||
color: #e1251b;
|
||||
}
|
||||
.detail-item-row {
|
||||
.detail-item-row {
|
||||
display: flex;
|
||||
>div{flex: 1;}
|
||||
> div {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
.detail-item {
|
||||
font-size: 12px;
|
||||
@@ -298,12 +367,12 @@ export default {
|
||||
padding-right: 8px;
|
||||
cursor: pointer;
|
||||
border-left: 1px solid #ccc;
|
||||
&:first-child{
|
||||
&:first-child {
|
||||
border: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
.detail-item:hover {
|
||||
color: $theme_color;
|
||||
color: #e1251b;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -414,7 +414,7 @@ export default {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
&:hover {
|
||||
color: #e4393c;
|
||||
color: $theme_color;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
@@ -428,8 +428,8 @@ export default {
|
||||
text-align: center;
|
||||
margin: 0 3px;
|
||||
&:hover {
|
||||
color: #e4393c;
|
||||
border-color: #e4393c;
|
||||
color: $theme_color;
|
||||
border-color: $theme_color;
|
||||
border-bottom-color: #fff;
|
||||
cursor: pointer;
|
||||
ul {
|
||||
@@ -447,7 +447,7 @@ export default {
|
||||
width: 300px;
|
||||
padding: 5px 10px;
|
||||
background: #fff;
|
||||
border: 1px solid #e4393c;
|
||||
border: 1px solid $theme_color;
|
||||
z-index: 1;
|
||||
&::before {
|
||||
content: "";
|
||||
@@ -470,7 +470,7 @@ export default {
|
||||
margin: 3px 0;
|
||||
text-align: left;
|
||||
&:hover {
|
||||
color: #e4393c;
|
||||
color: $theme_color;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
@@ -489,23 +489,23 @@ export default {
|
||||
background-color: #f3f3f3;
|
||||
border: 1px solid #ddd;
|
||||
&:hover {
|
||||
border-color: #e4393c;
|
||||
border-color: $theme_color;
|
||||
background-color: #fff;
|
||||
.ivu-icon {
|
||||
color: #fff;
|
||||
background-color: #e4393c;
|
||||
background-color: $theme_color;
|
||||
}
|
||||
}
|
||||
|
||||
span:nth-child(2) {
|
||||
color: #e4393c;
|
||||
color: $theme_color;
|
||||
}
|
||||
|
||||
.ivu-icon {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
color: #e4393c;
|
||||
color: $theme_color;
|
||||
line-height: 22px;
|
||||
width: 21px;
|
||||
height: 22px;
|
||||
@@ -557,8 +557,8 @@ export default {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border-color: #e4393c;
|
||||
border: 2px solid #e4393c;
|
||||
border-color: $theme_color;
|
||||
border: 2px solid $theme_color;
|
||||
top: 0;
|
||||
left: 0;
|
||||
position: relative;
|
||||
@@ -572,7 +572,7 @@ export default {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: #e4393c;
|
||||
color: $theme_color;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
@@ -585,7 +585,7 @@ export default {
|
||||
div {
|
||||
width: 0;
|
||||
border-top: 20px solid transparent;
|
||||
border-right: 20px solid #e4393c;
|
||||
border-right: 20px solid $theme_color;
|
||||
}
|
||||
.ivu-icon {
|
||||
font-size: 12px;
|
||||
@@ -598,7 +598,7 @@ export default {
|
||||
}
|
||||
}
|
||||
.border-color {
|
||||
border-color: #e4393c;
|
||||
border-color: $theme_color;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
@@ -620,8 +620,8 @@ export default {
|
||||
font-size: 12px;
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
color: #e4393c;
|
||||
border-color: #e4393c;
|
||||
color: $theme_color;
|
||||
border-color: $theme_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -674,7 +674,7 @@ export default {
|
||||
padding: 2px;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
color: #e4393c;
|
||||
color: $theme_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -696,8 +696,8 @@ export default {
|
||||
font-size: 12px;
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
color: #e4393c;
|
||||
border-color: #e4393c;
|
||||
color: $theme_color;
|
||||
border-color: $theme_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,12 +1,21 @@
|
||||
|
||||
const Cookie = require('js-cookie')
|
||||
module.exports = {
|
||||
title: "lili-shop", //配置显示在浏览器标签的title、底部信息、部分信息展示的值
|
||||
title:Cookie.get('siteName') || 'lilishop', //配置显示在浏览器标签的title、底部信息、部分信息展示的值
|
||||
icpCard: "", // icp证
|
||||
company: {
|
||||
href: "https://pickmall.cn",
|
||||
name: "北京宏业汇成科技有限公司",
|
||||
}, //公司信息
|
||||
icpMessage: "京ICP备20009696号-1", //icp备案
|
||||
aMapKey: "b440952723253aa9fe483e698057bf7d", //高德web端申请的api key
|
||||
/**
|
||||
* 高德地图申请链接
|
||||
* https://lbs.amap.com/api/javascript-api/guide/abc/prepare
|
||||
* 添加成功后,可获取到key值和安全密钥jscode(自2021年12月02日升级,升级之后所申请的 key 必须配备安全密钥 jscode 一起使用)
|
||||
*/
|
||||
//FIXME 请检查当前高德key创建的日期,如果2021年12月02日之前申请的 无需填写安全密钥
|
||||
aMapSecurityJsCode:"2bd0fbf621881f4c77be74f0e76495f3", // 高德web端js申请的安全密钥
|
||||
aMapKey: "7f11113750315d8543daaf5c3ba353ca", //高德web端js申请的api key
|
||||
enableCDN: true, //生产环境 是否启用cdn加载 vue等js
|
||||
port: 10000, //端口
|
||||
};
|
||||
|
||||
@@ -1,54 +1,65 @@
|
||||
import Vue from 'vue';
|
||||
import App from './App';
|
||||
import router from './router';
|
||||
import ViewUI from 'view-design';
|
||||
import './assets/styles/theme.less';
|
||||
import Vue from "vue";
|
||||
import App from "./App";
|
||||
import router from "./router";
|
||||
import ViewUI from "view-design";
|
||||
import "./assets/styles/theme.less";
|
||||
// import './assets/iconfont/iconfont.css';
|
||||
import * as filters from './plugins/filters';
|
||||
import store from '@/vuex/store'
|
||||
import storage from '@/plugins/storage';
|
||||
import * as filters from "./plugins/filters";
|
||||
import store from "@/vuex/store";
|
||||
import storage from "@/plugins/storage";
|
||||
// 全局引入封装组件
|
||||
import {InstallAll} from '@/components/global.js';
|
||||
import { InstallAll } from "@/components/global.js";
|
||||
|
||||
let title = require('@/config').title
|
||||
const { aMapSecurityJsCode, title } = require("@/config");
|
||||
Vue.use(ViewUI);
|
||||
Vue.use(InstallAll);
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
Object.keys(filters).forEach(key => {
|
||||
Object.keys(filters).forEach((key) => {
|
||||
Vue.filter(key, filters[key]);
|
||||
});
|
||||
|
||||
// 高德安全密钥
|
||||
if (aMapSecurityJsCode) {
|
||||
window._AMapSecurityConfig = {
|
||||
securityJsCode: aMapSecurityJsCode,
|
||||
};
|
||||
}
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
ViewUI.LoadingBar.start();
|
||||
window.document.title = to.meta.title === undefined ? title : to.meta.title
|
||||
window.document.title = to.meta.title === undefined ? title : to.meta.title;
|
||||
next();
|
||||
});
|
||||
|
||||
router.afterEach(route => {
|
||||
router.afterEach((route) => {
|
||||
ViewUI.LoadingBar.finish();
|
||||
});
|
||||
|
||||
Vue.prototype.linkTo = function (url) {
|
||||
if (url.substr(0, 1) === '/') { // 非外部链接,没有origin,只有路由地址
|
||||
if (router.mode === 'hash') {
|
||||
window.open(location.origin + '/#' + url, '_blank');
|
||||
if (url.substr(0, 1) === "/") {
|
||||
// 非外部链接,没有origin,只有路由地址
|
||||
if (router.mode === "hash") {
|
||||
window.open(location.origin + "/#" + url, "_blank");
|
||||
} else {
|
||||
window.open(location.origin + url, '_blank');
|
||||
window.open(location.origin + url, "_blank");
|
||||
}
|
||||
} else { // 外部链接,完整的url地址
|
||||
window.open(url, '_blank')
|
||||
} else {
|
||||
// 外部链接,完整的url地址
|
||||
window.open(url, "_blank");
|
||||
}
|
||||
}
|
||||
};
|
||||
// 联系客服
|
||||
Vue.prototype.connectCs = function (sign = '37ef9b97807d03c6741298ed4eb5b536d2d238e08a3c00fb01fe48f03a569974c99ad767e72c04b3165ef29aca2c488b505fe4ca') {
|
||||
const url = 'https://yzf.qq.com/xv/web/static/chat/index.html?sign=' + sign
|
||||
window.open(url, '_blank')
|
||||
}
|
||||
Vue.prototype.Cookies = storage
|
||||
Vue.prototype.connectCs = function (
|
||||
sign = "37ef9b97807d03c6741298ed4eb5b536d2d238e08a3c00fb01fe48f03a569974c99ad767e72c04b3165ef29aca2c488b505fe4ca"
|
||||
) {
|
||||
const url = "https://yzf.qq.com/xv/web/static/chat/index.html?sign=" + sign;
|
||||
window.open(url, "_blank");
|
||||
};
|
||||
Vue.prototype.Cookies = storage;
|
||||
/* eslint-disable no-new */
|
||||
new Vue({
|
||||
router,
|
||||
store,
|
||||
render: h => h(App)
|
||||
}).$mount("#app")
|
||||
render: (h) => h(App),
|
||||
}).$mount("#app");
|
||||
|
||||
@@ -34,7 +34,9 @@
|
||||
<div class="cart-goods">
|
||||
<div class="cart-goods-title">
|
||||
<div class="width_60">
|
||||
<Checkbox v-model="allChecked" @on-change="changeChecked(allChecked, 'all')"
|
||||
<Checkbox
|
||||
v-model="allChecked"
|
||||
@on-change="changeChecked(allChecked, 'all')"
|
||||
>全选</Checkbox
|
||||
>
|
||||
</div>
|
||||
@@ -77,7 +79,9 @@
|
||||
v-for="(item, index) in shop.couponList"
|
||||
:key="index"
|
||||
>
|
||||
<span v-if="item.couponType === 'PRICE'">¥{{ item.price }}</span>
|
||||
<span v-if="item.couponType === 'PRICE'"
|
||||
>¥{{ item.price }}</span
|
||||
>
|
||||
<span v-if="item.couponType === 'DISCOUNT'"
|
||||
>{{ item.couponDiscount }}折</span
|
||||
>
|
||||
@@ -100,12 +104,16 @@
|
||||
<div class="width_60">
|
||||
<Checkbox
|
||||
v-model="goods.checked"
|
||||
@on-change="changeChecked(goods.checked, 'goods', goods.goodsSku.id)"
|
||||
@on-change="
|
||||
changeChecked(goods.checked, 'goods', goods.goodsSku.id)
|
||||
"
|
||||
></Checkbox>
|
||||
</div>
|
||||
<div
|
||||
class="goods-title"
|
||||
@click="goGoodsDetail(goods.goodsSku.id, goods.goodsSku.goodsId)"
|
||||
@click="
|
||||
goGoodsDetail(goods.goodsSku.id, goods.goodsSku.goodsId)
|
||||
"
|
||||
>
|
||||
<img
|
||||
:src="
|
||||
@@ -114,25 +122,44 @@
|
||||
"
|
||||
/>
|
||||
<div>
|
||||
<p>{{ goods.goodsSku.goodsName }}</p>
|
||||
<template v-for="(promotion, promotionIndex) in goods.promotions">
|
||||
<p>
|
||||
{{ goods.goodsSku.goodsName }}
|
||||
</p>
|
||||
<p><Tag
|
||||
v-if="goods.goodsSku.salesModel === 'WHOLESALE'"
|
||||
class="goods-show-tag"
|
||||
color="purple"
|
||||
>
|
||||
批发商品
|
||||
</Tag></p>
|
||||
<template
|
||||
v-for="(promotion, promotionIndex) in goods.promotions"
|
||||
>
|
||||
<div
|
||||
class="promotion"
|
||||
:key="promotionIndex"
|
||||
v-if="promotion.promotionType === 'SECKILL'"
|
||||
>
|
||||
<span>秒杀</span>
|
||||
<promotion :time="promotion.endTime" type="cart"></promotion>
|
||||
<promotion
|
||||
:time="promotion.endTime"
|
||||
type="cart"
|
||||
></promotion>
|
||||
</div>
|
||||
</template>
|
||||
<template v-for="(promotion, promotionIndex) in goods.promotions">
|
||||
<template
|
||||
v-for="(promotion, promotionIndex) in goods.promotions"
|
||||
>
|
||||
<div
|
||||
class="promotion"
|
||||
:key="promotionIndex"
|
||||
v-if="promotion.promotionType === 'FULL_DISCOUNT'"
|
||||
>
|
||||
<span>满优惠活动</span>
|
||||
<promotion :time="promotion.endTime" type="cart"></promotion>
|
||||
<promotion
|
||||
:time="promotion.endTime"
|
||||
type="cart"
|
||||
></promotion>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
@@ -155,22 +182,27 @@
|
||||
{{ goods.subTotal | unitPrice("¥") }}
|
||||
</div>
|
||||
<div class="width_100">
|
||||
<span
|
||||
class="handle-btn"
|
||||
<Button
|
||||
v-if="!goods.errorMessage"
|
||||
size="small"
|
||||
type="primary"
|
||||
@click="delGoods(goods.goodsSku.id)"
|
||||
>删除</span
|
||||
>删除</Button
|
||||
>
|
||||
<span
|
||||
class="handle-btn"
|
||||
<Button
|
||||
v-if="!goods.errorMessage"
|
||||
size="small"
|
||||
type="info"
|
||||
@click="collectGoods(goods.goodsSku.id)"
|
||||
>收藏</span
|
||||
style="margin-left: 10px"
|
||||
>收藏</Button
|
||||
>
|
||||
</div>
|
||||
<div class="error-goods" v-if="goods.errorMessage">
|
||||
<div>{{ goods.errorMessage }}</div>
|
||||
<Button type="primary" @click="delGoods(goods.goodsSku.id)">删除</Button>
|
||||
<div style="margin-top: 20px">{{ goods.errorMessage }}</div>
|
||||
<Button type="primary" @click="delGoods(goods.goodsSku.id)"
|
||||
>删除</Button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -179,13 +211,19 @@
|
||||
<div class="cart-goods-footer">
|
||||
<div>
|
||||
<div class="width_60">
|
||||
<Checkbox v-model="allChecked" @on-change="changeChecked(allChecked, 'all')"
|
||||
<Checkbox
|
||||
v-model="allChecked"
|
||||
@on-change="changeChecked(allChecked, 'all')"
|
||||
>全选</Checkbox
|
||||
>
|
||||
</div>
|
||||
<div class="width_100 handle-btn" @click="delGoods()">删除选中商品</div>
|
||||
<div class="width_100 handle-btn" @click="delGoods()">
|
||||
删除选中商品
|
||||
</div>
|
||||
<!-- <div class="width_100 handle-btn" @click="collectGoods">移到我的收藏</div> -->
|
||||
<div class="width_100 handle-btn" @click="clearCart">清空购物车</div>
|
||||
<div class="width_100 handle-btn" @click="clearCart">
|
||||
清空购物车
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="selected-count">
|
||||
@@ -193,7 +231,9 @@
|
||||
>件商品
|
||||
</div>
|
||||
<div class="ml_20 save-price">
|
||||
已节省<span>{{ priceDetailDTO.discountPrice | unitPrice("¥") }}</span>
|
||||
已节省<span>{{
|
||||
priceDetailDTO.discountPrice | unitPrice("¥")
|
||||
}}</span>
|
||||
</div>
|
||||
<div class="ml_20 total-price">
|
||||
总价(不含运费):
|
||||
@@ -228,7 +268,7 @@ export default {
|
||||
return {
|
||||
couponAvailable: false, // 展示优惠券
|
||||
stepIndex: 0, // 当前处于哪一步,购物车==0,填写订单信息==1,成功提交订单==2
|
||||
goodsTotal: 1, // 商品数量
|
||||
goodsTotal: 0, // 商品数量
|
||||
checkedNum: 0, // 选中数量
|
||||
allChecked: false, // 全选
|
||||
loading: false, // 加载状态
|
||||
@@ -278,7 +318,7 @@ export default {
|
||||
const list = this.cartList;
|
||||
list.forEach((shop) => {
|
||||
shop.skuList.forEach((goods) => {
|
||||
if(goods.checked) {
|
||||
if (goods.checked) {
|
||||
idArr.push(goods.goodsSku.id);
|
||||
}
|
||||
});
|
||||
@@ -332,13 +372,13 @@ export default {
|
||||
},
|
||||
// 设置购买数量
|
||||
changeNum(val, id) {
|
||||
console.log(val, id);
|
||||
APICart.setCartGoodsNum({ skuId: id, num: val }).then((res) => {
|
||||
console.log(res);
|
||||
if (res.success) {
|
||||
this.getCartList();
|
||||
}
|
||||
});
|
||||
if (val) {
|
||||
APICart.setCartGoodsNum({ skuId: id, num: val }).then((res) => {
|
||||
if (res.success) {
|
||||
this.getCartList();
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
// 设置商品选中状态
|
||||
async changeChecked(status, type, id) {
|
||||
|
||||
@@ -101,7 +101,7 @@ export default {
|
||||
this.$router.push('/home/Coupons')
|
||||
},
|
||||
onCancel: () => {
|
||||
if (item.storeId !== 'platform') {
|
||||
if (item.storeId !== '0') {
|
||||
this.$router.push({path: '/merchant', query: {id: item.storeId}})
|
||||
} else {
|
||||
if (item.scopeType === 'PORTION_GOODS_CATEGORY') {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div style="background:#fff;">
|
||||
<div style="background: #fff">
|
||||
<BaseHeader></BaseHeader>
|
||||
<Search></Search>
|
||||
<drawer></drawer>
|
||||
@@ -8,34 +8,39 @@
|
||||
<div class="shop-nav-container">
|
||||
<Breadcrumb>
|
||||
<BreadcrumbItem to="/">首页</BreadcrumbItem>
|
||||
<BreadcrumbItem v-for="(item, index) in categoryBar" :to="goGoodsList(index)" target="_blank" :key="index">
|
||||
<BreadcrumbItem
|
||||
v-for="(item, index) in categoryBar"
|
||||
:to="goGoodsList(index)"
|
||||
target="_blank"
|
||||
:key="index"
|
||||
>
|
||||
{{ item.name }}
|
||||
</BreadcrumbItem>
|
||||
</Breadcrumb>
|
||||
<div class="store-collect">
|
||||
<span class="mr_10" v-if="goodsMsg.data">
|
||||
|
||||
<router-link :to="'Merchant?id=' + goodsMsg.data.storeId">{{ goodsMsg.data.storeName }}</router-link>
|
||||
<router-link :to="'Merchant?id=' + goodsMsg.data.storeId">{{
|
||||
goodsMsg.data.storeName
|
||||
}}</router-link>
|
||||
</span>
|
||||
<span @click="collect">
|
||||
<Icon type="ios-heart" :color="storeCollected ? '#ed3f14' : '#666'" />
|
||||
{{storeCollected ? '已收藏店铺' : '收藏店铺'}}
|
||||
</span>
|
||||
<!--
|
||||
先看下udesk merchantEuid 是否有值
|
||||
有的话 链接udesk
|
||||
没有的话 显示云智服
|
||||
-->
|
||||
<span class="ml_10" v-if="storeMsg.merchantEuid" @click="IMService()">联系客服</span>
|
||||
|
||||
<span v-else @click="connectCs(storeMsg.yzfSign)" class="ml_10">
|
||||
<Icon custom="icomoon icon-customer-service" />联系客服
|
||||
<Icon
|
||||
type="ios-heart"
|
||||
:color="storeCollected ? '#ed3f14' : '#666'"
|
||||
/>
|
||||
{{ storeCollected ? "已收藏店铺" : "收藏店铺" }}
|
||||
</span>
|
||||
<span class="ml_10" @click="IMService()">联系客服</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 商品信息展示 -->
|
||||
<ShowGoods v-if="goodsMsg.data" :detail="goodsMsg"></ShowGoods>
|
||||
<ShowGoods
|
||||
@handleClickSku="targetClickSku"
|
||||
v-if="goodsMsg.data"
|
||||
:detail="goodsMsg"
|
||||
></ShowGoods>
|
||||
<!-- 商品详细展示 -->
|
||||
<ShowGoodsDetail v-if="goodsMsg.data" :detail="goodsMsg"></ShowGoodsDetail>
|
||||
|
||||
@@ -58,6 +63,7 @@ import {
|
||||
} from "@/api/member";
|
||||
import { getDetailById } from "@/api/shopentry";
|
||||
import { getIMDetail } from "@/api/common";
|
||||
import Storage from "../plugins/storage";
|
||||
export default {
|
||||
name: "GoodsDetail",
|
||||
beforeRouteEnter(to, from, next) {
|
||||
@@ -66,7 +72,6 @@ export default {
|
||||
},
|
||||
created() {
|
||||
this.getGoodsDetail();
|
||||
// this.getIMDetailMethods();
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -80,8 +85,21 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
// 跳转im客服
|
||||
IMService() {
|
||||
window.open(this.IM);
|
||||
async IMService() {
|
||||
// 获取访问Token
|
||||
let accessToken = Storage.getItem("accessToken");
|
||||
await this.getIMDetailMethods();
|
||||
if (!accessToken) {
|
||||
this.$Message.error("请登录后再联系客服");
|
||||
return;
|
||||
}
|
||||
window.open(
|
||||
this.IMLink +
|
||||
"?token=" +
|
||||
accessToken +
|
||||
"&id=" +
|
||||
this.goodsMsg.data.storeId
|
||||
);
|
||||
},
|
||||
// 获取im信息
|
||||
async getIMDetailMethods() {
|
||||
@@ -90,10 +108,15 @@ export default {
|
||||
this.IMLink = res.result;
|
||||
}
|
||||
},
|
||||
// 点击规格
|
||||
targetClickSku(val) {
|
||||
this.getGoodsDetail(val);
|
||||
},
|
||||
// 获取商品详情
|
||||
getGoodsDetail() {
|
||||
getGoodsDetail(val) {
|
||||
this.isLoading = true;
|
||||
const params = this.$route.query;
|
||||
const params = val || this.$route.query;
|
||||
|
||||
// 分销员id
|
||||
let distributionId =
|
||||
params && params.distributionId
|
||||
@@ -130,7 +153,7 @@ export default {
|
||||
});
|
||||
});
|
||||
this.categoryBar = cateArr;
|
||||
this.goodsMsg = res.result;
|
||||
this.$set(this, "goodsMsg", res.result);
|
||||
// 判断是否收藏
|
||||
if (this.Cookies.getItem("userInfo")) {
|
||||
isCollection("STORE", this.goodsMsg.data.storeId).then((res) => {
|
||||
@@ -139,18 +162,20 @@ export default {
|
||||
}
|
||||
});
|
||||
}
|
||||
// 获取店铺信息
|
||||
getDetailById(this.goodsMsg.data.storeId).then((res) => {
|
||||
if (res.success) {
|
||||
this.storeMsg = res.result;
|
||||
}
|
||||
});
|
||||
if (!this.storeMsg) {
|
||||
// 获取店铺信息
|
||||
getDetailById(this.goodsMsg.data.storeId).then((res) => {
|
||||
if (res.success) {
|
||||
this.storeMsg = res.result;
|
||||
}
|
||||
});
|
||||
}
|
||||
} else {
|
||||
this.$Message.error(res.message);
|
||||
this.$router.push("/");
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
.catch((e) => {
|
||||
this.$router.push("/");
|
||||
});
|
||||
},
|
||||
@@ -181,16 +206,7 @@ export default {
|
||||
}
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
"$route.query.skuId": function (val) {
|
||||
location.reload();
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
IM() {
|
||||
return this.IMLink + this.storeMsg.merchantEuid;
|
||||
},
|
||||
},
|
||||
watch: {},
|
||||
components: {
|
||||
Search,
|
||||
ShopHeader,
|
||||
|
||||
@@ -62,6 +62,13 @@
|
||||
</span>
|
||||
</div>
|
||||
<div class="goods-show-detail">
|
||||
<Tag
|
||||
v-if="item.content.salesModel === 'WHOLESALE'"
|
||||
class="goods-show-tag"
|
||||
color="purple"
|
||||
>
|
||||
批发
|
||||
</Tag>
|
||||
<span>{{ item.content.goodsName }}</span>
|
||||
</div>
|
||||
<div class="goods-show-num">
|
||||
@@ -85,7 +92,9 @@
|
||||
</div>
|
||||
<div
|
||||
class="goods-show-middle"
|
||||
v-else-if="goodsListType.content.goodsType == 'PHYSICAL_GOODS'"
|
||||
v-else-if="
|
||||
goodsListType.content.goodsType == 'PHYSICAL_GOODS'
|
||||
"
|
||||
>
|
||||
实物
|
||||
</div>
|
||||
@@ -150,6 +159,12 @@ export default {
|
||||
$route() {
|
||||
const keyword = this.$route.query.keyword;
|
||||
this.handleSearch(keyword);
|
||||
if (this.$route.query.categoryId) {
|
||||
let cateId = this.$route.query.categoryId.split(",");
|
||||
Object.assign(this.params, this.$route.query);
|
||||
this.params.categoryId = cateId[cateId.length - 1];
|
||||
this.getGoodsList();
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
@@ -197,6 +212,7 @@ export default {
|
||||
this.params.pageSize = val;
|
||||
this.getGoodsList();
|
||||
},
|
||||
|
||||
// 获取商品列表
|
||||
getGoodsList() {
|
||||
this.loading = true;
|
||||
@@ -249,6 +265,17 @@ export default {
|
||||
padding: 0 3px;
|
||||
background-color: #e23a3a;
|
||||
}
|
||||
|
||||
.goods-show-tag {
|
||||
height: 18px;
|
||||
width: 32px;
|
||||
line-height: 14px;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
padding: 0 3px;
|
||||
}
|
||||
|
||||
.goods-show-seller {
|
||||
// padding:3px 0;
|
||||
vertical-align: middle;
|
||||
@@ -295,7 +322,7 @@ export default {
|
||||
.item-as-title {
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
color: #e4393c;
|
||||
color: $theme_color;
|
||||
line-height: 36px;
|
||||
font-size: 18px;
|
||||
}
|
||||
@@ -396,7 +423,7 @@ export default {
|
||||
background-color: #fff;
|
||||
}
|
||||
.goods-list-tool span:hover {
|
||||
border-color: #e4393c;
|
||||
border-color: $theme_color;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
z-index: 1;
|
||||
@@ -408,7 +435,7 @@ export default {
|
||||
.goods-list-tool-active {
|
||||
color: #fff;
|
||||
border-left: 1px solid #ccc;
|
||||
background-color: #e4393c !important;
|
||||
background-color: $theme_color !important;
|
||||
}
|
||||
|
||||
/* ---------------商品栏结束------------------- */
|
||||
|
||||
@@ -52,7 +52,7 @@ export default {
|
||||
methods: {
|
||||
getIndexData () {
|
||||
// 获取首页装修数据
|
||||
indexData({ clientType: 'PC' }).then((res) => {
|
||||
indexData({ clientType: 'PC' }).then(async (res) => {
|
||||
if (res.success) {
|
||||
let dataJson = JSON.parse(res.result.pageData);
|
||||
// 秒杀活动不是装修的数据,需要调用接口判断是否有秒杀商品
|
||||
@@ -65,7 +65,7 @@ export default {
|
||||
this.carouselLarge = true
|
||||
this.carouselOpacity = true
|
||||
} else if (type === 'seckill') {
|
||||
let seckill = this.getListByDay()
|
||||
let seckill = await this.getListByDay()
|
||||
dataJson.list[i].options.list = seckill
|
||||
}
|
||||
}
|
||||
@@ -106,7 +106,7 @@ export default {
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
z-index: 3000;
|
||||
z-index: 9999;
|
||||
box-shadow:0 0 10px 2px rgb(90 90 90 / 60%);
|
||||
transition: 0.35s;
|
||||
}
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
<Carousel loop :autoplay-speed="5000" class="login-carousel" arrow="never">
|
||||
<CarouselItem>
|
||||
<div class="demo-carousel" @click='$refs.verify.show = false'>
|
||||
<img src="https://wanmi-b2b.oss-cn-shanghai.aliyuncs.com/201811141632252680" />
|
||||
<img src="https://lili-system.oss-cn-beijing.aliyuncs.com/background.jpg" />
|
||||
</div>
|
||||
</CarouselItem>
|
||||
</Carousel>
|
||||
@@ -21,69 +21,119 @@
|
||||
<div class="form-box" @click='$refs.verify.show = false'>
|
||||
<div class="account-number">
|
||||
<div class="tab-switch">
|
||||
<span>{{type?'账号登录':'验证码登录'}}</span>
|
||||
<span @click="type = !type">{{type?'验证码登录':'账号登录'}}</span>
|
||||
<span>{{ type ? '账号登录' : '验证码登录' }}</span>
|
||||
<span @click="type = !type,scannerCodeLoginFLag=false">{{ type ? '验证码登录' : '账号登录' }}</span>
|
||||
</div>
|
||||
<div @click="$router.push('signUp')">立即注册</div>
|
||||
<!---->
|
||||
<div @click="scannerCodeLoginFLag=!scannerCodeLoginFLag">{{!scannerCodeLoginFLag ? '扫码登录' : '返回'}}</div>
|
||||
</div>
|
||||
<!-- 账号密码登录 -->
|
||||
<Form ref="formInline" :model="formData" :rules="ruleInline" v-show="type === true"
|
||||
@click.self='$refs.verify.show = false'>
|
||||
<FormItem prop="username">
|
||||
<i-input type="text" v-model="formData.username" clearable placeholder="用户名">
|
||||
<Icon type="md-person" slot="prepend"></Icon>
|
||||
</i-input>
|
||||
</FormItem>
|
||||
<FormItem prop="password">
|
||||
<i-input type="password" v-model="formData.password" clearable placeholder="密码">
|
||||
<Icon type="md-lock" slot="prepend"> </Icon>
|
||||
</i-input>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<Button type="error" @click.stop="handleSubmit('formInline')" long>登录</Button>
|
||||
</FormItem>
|
||||
</Form>
|
||||
<!-- 验证码登录 -->
|
||||
<Form ref="formSms" :model="formSms" :rules="ruleInline" v-show="type === false"
|
||||
@click.self='$refs.verify.show = false'>
|
||||
<FormItem prop="mobile">
|
||||
<i-input type="text" v-model="formSms.mobile" clearable placeholder="手机号">
|
||||
<Icon type="md-lock" slot="prepend"></Icon>
|
||||
</i-input>
|
||||
</FormItem>
|
||||
<FormItem prop="code">
|
||||
<i-input type="text" v-model="formSms.code" placeholder="手机验证码">
|
||||
<Icon type="ios-text-outline" style="font-weight: bold" slot="prepend" />
|
||||
<Button slot="append" @click="sendCode">{{ codeMsg }}</Button>
|
||||
</i-input>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<Button @click.stop="verifyBtnClick" long
|
||||
:type="verifyStatus?'success':'default'">{{verifyStatus?'验证通过':'点击完成安全验证'}}</Button>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<Button type="error" @click="handleSubmit('formSms')" long>登录</Button>
|
||||
</FormItem>
|
||||
</Form>
|
||||
<div class="regist">
|
||||
<span @click="$router.push('forgetPassword')">忘记密码</span>
|
||||
</div>
|
||||
<div class="other-login">
|
||||
<svg t="1631154795933" class="icon" @click="handleWebLogin('QQ')" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="4969" width="32" height="32">
|
||||
<path
|
||||
d="M824.8 613.2c-16-51.4-34.4-94.6-62.7-165.3C766.5 262.2 689.3 112 511.5 112 331.7 112 256.2 265.2 261 447.9c-28.4 70.8-46.7 113.7-62.7 165.3-34 109.5-23 154.8-14.6 155.8 18 2.2 70.1-82.4 70.1-82.4 0 49 25.2 112.9 79.8 159-26.4 8.1-85.7 29.9-71.6 53.8 11.4 19.3 196.2 12.3 249.5 6.3 53.3 6 238.1 13 249.5-6.3 14.1-23.8-45.3-45.7-71.6-53.8 54.6-46.2 79.8-110.1 79.8-159 0 0 52.1 84.6 70.1 82.4 8.5-1.1 19.5-46.4-14.5-155.8z"
|
||||
p-id="4970" fill="#1296db"></path>
|
||||
</svg>
|
||||
<svg t="1631154766336" class="icon" @click="handleWebLogin('WECHAT_PC')" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="3844" width="32" height="32">
|
||||
<path
|
||||
d="M683.058 364.695c11 0 22 1.016 32.943 1.976C686.564 230.064 538.896 128 370.681 128c-188.104 0.66-342.237 127.793-342.237 289.226 0 93.068 51.379 169.827 136.725 229.256L130.72 748.43l119.796-59.368c42.918 8.395 77.37 16.79 119.742 16.79 11 0 21.46-0.48 31.914-1.442a259.168 259.168 0 0 1-10.455-71.358c0.485-148.002 128.744-268.297 291.403-268.297l-0.06-0.06z m-184.113-91.992c25.99 0 42.913 16.79 42.913 42.575 0 25.188-16.923 42.579-42.913 42.579-25.45 0-51.38-16.85-51.38-42.58 0-25.784 25.93-42.574 51.38-42.574z m-239.544 85.154c-25.384 0-51.374-16.85-51.374-42.58 0-25.784 25.99-42.574 51.374-42.574 25.45 0 42.918 16.79 42.918 42.575 0 25.188-16.924 42.579-42.918 42.579z m736.155 271.655c0-135.647-136.725-246.527-290.983-246.527-162.655 0-290.918 110.88-290.918 246.527 0 136.128 128.263 246.587 290.918 246.587 33.972 0 68.423-8.395 102.818-16.85l93.809 50.973-25.93-84.677c68.907-51.93 120.286-119.815 120.286-196.033z m-385.275-42.58c-16.923 0-34.452-16.79-34.452-34.179 0-16.79 17.529-34.18 34.452-34.18 25.99 0 42.918 16.85 42.918 34.18 0 17.39-16.928 34.18-42.918 34.18z m188.165 0c-16.984 0-33.972-16.79-33.972-34.179 0-16.79 16.927-34.18 33.972-34.18 25.93 0 42.913 16.85 42.913 34.18 0 17.39-16.983 34.18-42.913 34.18z"
|
||||
fill="#09BB07" p-id="3845"></path>
|
||||
</svg>
|
||||
<!--扫码登录-->
|
||||
<div v-show="scannerCodeLoginFLag">
|
||||
<div class="qr-container">
|
||||
<div class='qr-shadow flex' v-show="qrCodeStatus == 'fail'">
|
||||
<span>
|
||||
二维码已失效
|
||||
</span>
|
||||
<Button size='small' @click="createPCLoginSession">刷新二维码</Button>
|
||||
</div>
|
||||
<vue-qr
|
||||
:text="qrCode"
|
||||
:margin="0"
|
||||
colorDark="#000"
|
||||
colorLight="#fff"
|
||||
:size="150"
|
||||
></vue-qr>
|
||||
</div>
|
||||
<div class="drag-area">
|
||||
<!-- 等待扫码-->
|
||||
<div v-if="scannerCodeLoginStatus === 0" class="pending-scan">
|
||||
<p>打开手机App/小程序,扫码登录</p>
|
||||
</div>
|
||||
<!-- 已经扫码-->
|
||||
<div v-else-if="scannerCodeLoginStatus === 1" class="scanned">
|
||||
<p>扫码成功,等待确认</p>
|
||||
</div>
|
||||
|
||||
<!-- 存在session,等待发送给客户端验证-->
|
||||
<div v-if="scannerCodeLoginStatus === 2" class="scanned">
|
||||
<p>登录成功,正在页面跳转</p>
|
||||
</div>
|
||||
|
||||
<!-- 已经发送登录请求-->
|
||||
<div v-else-if="scannerCodeLoginStatus === 3" class="quick-logining">
|
||||
<p>取消登录</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div v-show="!scannerCodeLoginFLag">
|
||||
<!-- 账号密码登录 -->
|
||||
<Form ref="formInline" :model="formData" :rules="ruleInline" v-show="type === true"
|
||||
@click.self='$refs.verify.show = false'>
|
||||
<FormItem prop="username">
|
||||
<i-input type="text" v-model="formData.username" clearable placeholder="用户名">
|
||||
<Icon type="md-person" slot="prepend"></Icon>
|
||||
</i-input>
|
||||
</FormItem>
|
||||
<FormItem prop="password">
|
||||
<i-input type="password" v-model="formData.password" clearable placeholder="密码">
|
||||
<Icon type="md-lock" slot="prepend"></Icon>
|
||||
</i-input>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<Button type="error" @click.stop="handleSubmit('formInline')" long>登录</Button>
|
||||
</FormItem>
|
||||
</Form>
|
||||
<!-- 验证码登录 -->
|
||||
<Form ref="formSms" :model="formSms" :rules="ruleInline" v-show="type === false"
|
||||
@click.self='$refs.verify.show = false'>
|
||||
<FormItem prop="mobile">
|
||||
<i-input type="text" v-model="formSms.mobile" clearable placeholder="手机号">
|
||||
<Icon type="md-lock" slot="prepend"></Icon>
|
||||
</i-input>
|
||||
</FormItem>
|
||||
<FormItem prop="code">
|
||||
<i-input type="text" v-model="formSms.code" placeholder="手机验证码">
|
||||
<Icon type="ios-text-outline" style="font-weight: bold" slot="prepend"/>
|
||||
<Button slot="append" @click="sendCode">{{ codeMsg }}</Button>
|
||||
</i-input>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<Button @click.stop="verifyBtnClick" long
|
||||
:type="verifyStatus?'success':'default'">{{ verifyStatus ? '验证通过' : '点击完成安全验证' }}
|
||||
</Button>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<Button type="error" @click="handleSubmit('formSms')" long>登录</Button>
|
||||
</FormItem>
|
||||
</Form>
|
||||
</div>
|
||||
<div class="other">
|
||||
<div class="other-login">
|
||||
<svg t="1631154795933" class="icon" @click="handleWebLogin('QQ')" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="4969" width="32" height="32">
|
||||
<path
|
||||
d="M824.8 613.2c-16-51.4-34.4-94.6-62.7-165.3C766.5 262.2 689.3 112 511.5 112 331.7 112 256.2 265.2 261 447.9c-28.4 70.8-46.7 113.7-62.7 165.3-34 109.5-23 154.8-14.6 155.8 18 2.2 70.1-82.4 70.1-82.4 0 49 25.2 112.9 79.8 159-26.4 8.1-85.7 29.9-71.6 53.8 11.4 19.3 196.2 12.3 249.5 6.3 53.3 6 238.1 13 249.5-6.3 14.1-23.8-45.3-45.7-71.6-53.8 54.6-46.2 79.8-110.1 79.8-159 0 0 52.1 84.6 70.1 82.4 8.5-1.1 19.5-46.4-14.5-155.8z"
|
||||
p-id="4970" fill="#1296db"></path>
|
||||
</svg>
|
||||
<svg t="1631154766336" class="icon" @click="handleWebLogin('WECHAT_PC')" viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="3844" width="32" height="32">
|
||||
<path
|
||||
d="M683.058 364.695c11 0 22 1.016 32.943 1.976C686.564 230.064 538.896 128 370.681 128c-188.104 0.66-342.237 127.793-342.237 289.226 0 93.068 51.379 169.827 136.725 229.256L130.72 748.43l119.796-59.368c42.918 8.395 77.37 16.79 119.742 16.79 11 0 21.46-0.48 31.914-1.442a259.168 259.168 0 0 1-10.455-71.358c0.485-148.002 128.744-268.297 291.403-268.297l-0.06-0.06z m-184.113-91.992c25.99 0 42.913 16.79 42.913 42.575 0 25.188-16.923 42.579-42.913 42.579-25.45 0-51.38-16.85-51.38-42.58 0-25.784 25.93-42.574 51.38-42.574z m-239.544 85.154c-25.384 0-51.374-16.85-51.374-42.58 0-25.784 25.99-42.574 51.374-42.574 25.45 0 42.918 16.79 42.918 42.575 0 25.188-16.924 42.579-42.918 42.579z m736.155 271.655c0-135.647-136.725-246.527-290.983-246.527-162.655 0-290.918 110.88-290.918 246.527 0 136.128 128.263 246.587 290.918 246.587 33.972 0 68.423-8.395 102.818-16.85l93.809 50.973-25.93-84.677c68.907-51.93 120.286-119.815 120.286-196.033z m-385.275-42.58c-16.923 0-34.452-16.79-34.452-34.179 0-16.79 17.529-34.18 34.452-34.18 25.99 0 42.918 16.85 42.918 34.18 0 17.39-16.928 34.18-42.918 34.18z m188.165 0c-16.984 0-33.972-16.79-33.972-34.179 0-16.79 16.927-34.18 33.972-34.18 25.93 0 42.913 16.85 42.913 34.18 0 17.39-16.983 34.18-42.913 34.18z"
|
||||
fill="#09BB07" p-id="3845"></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="register">
|
||||
<span style="color:red" @click="$router.push('signUp')">还没有账号?点击立即注册</span>
|
||||
<span @click="$router.push('forgetPassword')">忘记密码</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 拼图验证码 -->
|
||||
<verify ref="verify" class="verify-con" verifyType="LOGIN" @change="verifyChange"></verify>
|
||||
</div>
|
||||
@@ -96,7 +146,7 @@
|
||||
<Row type="flex" justify="center" class="copyright">
|
||||
Copyright © {{year}} - Present
|
||||
<a href="https://pickmall.cn" target="_blank" style="margin: 0 5px">{{config.title}}</a>
|
||||
版权所有
|
||||
版权所有
|
||||
</Row>
|
||||
</div>
|
||||
</div>
|
||||
@@ -108,18 +158,27 @@ import * as RegExp from "@/plugins/RegExp.js";
|
||||
import { md5 } from "@/plugins/md5.js";
|
||||
import * as apiLogin from "@/api/login.js";
|
||||
import { sendSms } from "@/api/common.js";
|
||||
import { webLogin, loginCallback } from "@/api/login.js";
|
||||
import { webLogin, loginCallback,sCLogin,getSCLoginCode} from "@/api/login.js";
|
||||
import storage from "@/plugins/storage.js";
|
||||
import verify from "@/components/verify";
|
||||
import vueQr from "vue-qr";
|
||||
|
||||
export default {
|
||||
name: "Login",
|
||||
components: {
|
||||
verify,
|
||||
vueQr
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
config:require('@/config'),
|
||||
qrCodeStatus:"success", //
|
||||
qrCode: '',
|
||||
qrSessionToken:'',
|
||||
//是否是二维码登录
|
||||
scannerCodeLoginFLag: false,
|
||||
scannerCodeLoginStatus: 0,
|
||||
qrCodeTimer:null,
|
||||
config: require('@/config'),
|
||||
type: true, // true 账号登录 false 验证码登录
|
||||
formData: {
|
||||
// 登录表单
|
||||
@@ -134,19 +193,19 @@ export default {
|
||||
verifyStatus: false, // 是否图片验证通过
|
||||
ruleInline: {
|
||||
// 验证规则
|
||||
username: [{ required: true, message: "请输入用户名" }],
|
||||
username: [{required: true, message: "请输入用户名"}],
|
||||
password: [
|
||||
{ required: true, message: "请输入密码" },
|
||||
{ type: "string", min: 6, message: "密码不能少于6位" },
|
||||
{required: true, message: "请输入密码"},
|
||||
{type: "string", min: 6, message: "密码不能少于6位"},
|
||||
],
|
||||
mobile: [
|
||||
{ required: true, message: "请输入手机号码" },
|
||||
{required: true, message: "请输入手机号码"},
|
||||
{
|
||||
pattern: RegExp.mobile,
|
||||
message: "请输入正确的手机号",
|
||||
},
|
||||
],
|
||||
code: [{ required: true, message: "请输入手机验证码" }],
|
||||
code: [{required: true, message: "请输入手机验证码"}],
|
||||
},
|
||||
codeMsg: "发送验证码", // 验证码文字
|
||||
interval: null, // 定时器
|
||||
@@ -154,7 +213,14 @@ export default {
|
||||
year: new Date().getFullYear(),
|
||||
};
|
||||
},
|
||||
watch:{
|
||||
|
||||
scannerCodeLoginFLag(val){
|
||||
!val ? this.clearInterval() : ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
// 登录
|
||||
handleSubmit(name) {
|
||||
this.$refs[name].validate((valid) => {
|
||||
@@ -241,24 +307,7 @@ export default {
|
||||
.login(data)
|
||||
.then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success("登录成功");
|
||||
storage.setItem("accessToken", res.result.accessToken);
|
||||
storage.setItem("refreshToken", res.result.refreshToken);
|
||||
apiLogin.getMemberMsg().then((res) => {
|
||||
this.$Spin.hide();
|
||||
if (res.success) {
|
||||
storage.setItem("userInfo", res.result);
|
||||
let query = this.$route.query;
|
||||
if (query.rePath) {
|
||||
this.$router.push({
|
||||
path: query.rePath,
|
||||
query: JSON.parse(query.query),
|
||||
});
|
||||
} else {
|
||||
this.$router.push("/");
|
||||
}
|
||||
}
|
||||
});
|
||||
this.loginSuccess(res.result.accessToken,res.result.refreshToken);
|
||||
} else {
|
||||
this.$Spin.hide();
|
||||
this.$Message.error(res.message);
|
||||
@@ -282,6 +331,89 @@ export default {
|
||||
// 第三方登录
|
||||
webLogin(type);
|
||||
},
|
||||
loginSuccess(accessToken,refreshToken){
|
||||
this.$Message.success("登录成功");
|
||||
storage.setItem("accessToken", accessToken);
|
||||
storage.setItem("refreshToken", refreshToken);
|
||||
apiLogin.getMemberMsg().then((res) => {
|
||||
this.$Spin.hide();
|
||||
if (res.success) {
|
||||
storage.setItem("userInfo", res.result);
|
||||
let query = this.$route.query;
|
||||
if (query.rePath) {
|
||||
this.$router.push({
|
||||
path: query.rePath,
|
||||
query: JSON.parse(query.query),
|
||||
});
|
||||
} else {
|
||||
this.$router.push("/");
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
async createPCLoginSession() {
|
||||
getSCLoginCode({}).then(response=>{
|
||||
this.clearQRLoginInfo();
|
||||
if (response.code == 200) {
|
||||
this.qrCodeStatus = 'success'
|
||||
let session = response.result;
|
||||
this.qrSessionToken = session.token;
|
||||
if (session.status === 0) {
|
||||
this.qrCode = session.token;
|
||||
this.refreshQrCode();
|
||||
}
|
||||
this.qrLogin();
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
async refreshQrCode() {
|
||||
if (!this.qrCodeTimer) {
|
||||
this.qrCodeTimer = setInterval(() => {
|
||||
|
||||
this.qrCodeStatus = 'fail' // 如果过期将二维码转为失效状态
|
||||
}, 10 * 1000);
|
||||
}
|
||||
},
|
||||
|
||||
clearQRLoginInfo(){
|
||||
this.scannerCodeLoginStatus=0;
|
||||
this.qrSessionToken='';
|
||||
if (this.qrCodeTimer) {
|
||||
clearInterval(this.qrCodeTimer)
|
||||
}
|
||||
this.qrCodeTimer= null;
|
||||
},
|
||||
|
||||
async qrLogin() {
|
||||
if(!this.qrSessionToken) return;
|
||||
sCLogin(this.qrSessionToken,{beforeSessionStatus:this.scannerCodeLoginStatus}).then(response=>{
|
||||
if (response.success) {
|
||||
this.scannerCodeLoginStatus = response.result.status;
|
||||
switch (response.result.status) {
|
||||
case 0:
|
||||
case 1:
|
||||
this.qrLogin();break;
|
||||
case 2:
|
||||
this.loginSuccess(response.result.token.accessToken,response.result.token.refreshToken);
|
||||
break;
|
||||
case 3:
|
||||
this.createPCLoginSession();
|
||||
break;
|
||||
default:
|
||||
this.clearQRLoginInfo();
|
||||
break
|
||||
}
|
||||
} else{
|
||||
this.clearQRLoginInfo();
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
destroyed() {
|
||||
this.clearQRLoginInfo();
|
||||
},
|
||||
mounted() {
|
||||
let uuid = this.$route.query.state;
|
||||
@@ -289,28 +421,21 @@ export default {
|
||||
storage.setItem("uuid", uuid);
|
||||
loginCallback(uuid).then((res) => {
|
||||
if (res.success) {
|
||||
const result = res.result;
|
||||
storage.setItem("accessToken", result.accessToken);
|
||||
storage.setItem("refreshToken", result.refreshToken);
|
||||
apiLogin.getMemberMsg().then((res) => {
|
||||
if (res.success) {
|
||||
storage.setItem("userInfo", res.result);
|
||||
let query = this.$route.query;
|
||||
if (query.rePath) {
|
||||
this.$router.push({
|
||||
path: query.rePath,
|
||||
query: JSON.parse(query.query),
|
||||
});
|
||||
} else {
|
||||
this.$router.push("/");
|
||||
}
|
||||
}
|
||||
});
|
||||
this.loginSuccess(res.result.accessToken,res.result.refreshToken);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
scannerCodeLoginFLag(v){
|
||||
if(v){
|
||||
this.createPCLoginSession();
|
||||
console.log("二维码登录");
|
||||
}else{
|
||||
console.log("取消二维码登录");
|
||||
this.clearQRLoginInfo();
|
||||
}
|
||||
},
|
||||
type(v) {
|
||||
if (v) {
|
||||
this.$refs.formInline.resetFields();
|
||||
@@ -327,10 +452,43 @@ export default {
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.drag-area{
|
||||
margin: 10px 0;
|
||||
}
|
||||
.login {
|
||||
height: 100%;
|
||||
background-color: #f0f2f5;
|
||||
}
|
||||
.other{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.qr-container{
|
||||
text-align: center;
|
||||
margin: 20px 0;
|
||||
position: relative;
|
||||
>.qr-shadow{
|
||||
background: rgba(0, 0, 0, 0.45);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -75px;
|
||||
top: 0;
|
||||
z-index: 99;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
color: #fff;
|
||||
>span{
|
||||
margin-bottom: 20px;
|
||||
font-size: 13px;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.top-content {
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
@@ -347,19 +505,35 @@ export default {
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
width: 150px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
div {
|
||||
font-size: 20px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.pending-scan{
|
||||
text-align: center;
|
||||
color:black;
|
||||
}
|
||||
.scanned{
|
||||
text-align: center;
|
||||
color:green;
|
||||
}
|
||||
.quick-logining{
|
||||
text-align: center;
|
||||
color:red;
|
||||
}
|
||||
|
||||
.login-carousel {
|
||||
width: 100%;
|
||||
height: 550px;
|
||||
|
||||
.demo-carousel {
|
||||
height: 550px;
|
||||
width: inherit;
|
||||
@@ -382,15 +556,18 @@ export default {
|
||||
right: 15%;
|
||||
padding: 20px;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
|
||||
.account-number {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: baseline;
|
||||
font-weight: bold;
|
||||
|
||||
> div:nth-child(2) {
|
||||
color: $theme_color;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tab-switch {
|
||||
height: 40px;
|
||||
font-size: 14px;
|
||||
@@ -404,6 +581,7 @@ export default {
|
||||
span:nth-child(2) {
|
||||
cursor: pointer;
|
||||
padding-left: 10px;
|
||||
|
||||
&:hover {
|
||||
color: $theme_color;
|
||||
}
|
||||
@@ -420,7 +598,7 @@ export default {
|
||||
}
|
||||
|
||||
.other-login {
|
||||
margin: 0 auto;
|
||||
|
||||
> svg {
|
||||
cursor: pointer;
|
||||
width: 24px;
|
||||
@@ -428,18 +606,22 @@ export default {
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
.regist {
|
||||
|
||||
.register {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
margin-top: -10px;
|
||||
|
||||
span {
|
||||
margin-left: 10px;
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
color: $theme_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.foot {
|
||||
position: fixed;
|
||||
bottom: 4vh;
|
||||
@@ -447,19 +629,24 @@ export default {
|
||||
left: calc(50% - 184px);
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
font-size: 14px;
|
||||
|
||||
.help {
|
||||
margin: 0 auto;
|
||||
margin-bottom: 1vh;
|
||||
width: 60%;
|
||||
|
||||
.item {
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
}
|
||||
|
||||
:hover {
|
||||
color: rgba(0, 0, 0, 0.65);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.icon-hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -1,108 +1,207 @@
|
||||
<template>
|
||||
<div class="merchant">
|
||||
<BaseHeader />
|
||||
<!-- 搜索栏 -->
|
||||
<Search :store="true" @search="search"></Search>
|
||||
<!-- 店铺logo -->
|
||||
<div class="shop-logo">
|
||||
<div>
|
||||
<img :src="storeMsg.storeLogo" height="80" alt="">
|
||||
<BaseHeader/>
|
||||
<!-- 搜索栏 -->
|
||||
<Search :store="true" @search="search"></Search>
|
||||
<!-- 店铺logo -->
|
||||
<div class="shop-logo">
|
||||
<div>
|
||||
<p>{{storeMsg.storeName || 'xx店铺'}}</p>
|
||||
<p class="ellipsis" :alt="storeMsg.storeDesc" v-html="storeMsg.storeDesc"></p>
|
||||
</div>
|
||||
<div>
|
||||
<span class="hover-pointer" @click="collect"><Icon type="ios-heart" :color="storeCollected ? '#ed3f14' : '#fff'" />{{storeCollected?'已收藏店铺':'收藏店铺'}}</span>
|
||||
<span style="width:80px" class="hover-pointer ml_10" @click="connectCs(storeMsg.yzfSign)"><Icon custom="icomoon icon-customer-service" />联系客服</span>
|
||||
<span style="width:80px" class="hover-pointer ml_10" @click="IMService()"><Icon custom="icomoon icon-customer-service" />联系客服</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="store-category">
|
||||
<ul class="cate-list">
|
||||
<li class="cate-item" @click="searchByCate({id:'', labelName: '店铺推荐'})">首页</li>
|
||||
<li class="cate-item" v-for="(cate, index) in cateList" :key="index">
|
||||
<Dropdown v-if="cate.children.length">
|
||||
<div @click.self="searchByCate(cate)">{{cate.labelName}} <Icon type="ios-arrow-down"></Icon></div>
|
||||
<DropdownMenu slot="list">
|
||||
<DropdownItem @click.native="searchByCate(sec)" :name="sec.id" v-for="sec in cate.children" :key="sec.id">{{sec.labelName}}</DropdownItem>
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
<span v-else @click.self="searchByCate(cate)">{{cate.labelName}}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="promotion-decorate">{{cateName}}</div>
|
||||
|
||||
<div class="goods-list">
|
||||
<empty v-if="goodsList.length === 0" />
|
||||
<div
|
||||
v-else
|
||||
class="goods-show-info"
|
||||
v-for="(item, index) in goodsList"
|
||||
:key="index"
|
||||
@click="goGoodsDetail(item.content.id, item.content.goodsId)"
|
||||
>
|
||||
<div class="goods-show-img">
|
||||
<img width="220" height="220" :src="item.content.thumbnail" />
|
||||
</div>
|
||||
<div class="goods-show-price">
|
||||
<span>
|
||||
<span class="seckill-price text-danger">{{
|
||||
item.content.price | unitPrice("¥")
|
||||
}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="goods-show-detail">
|
||||
<span>{{ item.content.goodsName }}</span>
|
||||
</div>
|
||||
<div class="goods-show-num">
|
||||
已有<span>{{ item.content.commentNum || 0 }}</span>人评价
|
||||
</div>
|
||||
<div class="store-category">
|
||||
<ul class="cate-list">
|
||||
<li
|
||||
class="cate-item"
|
||||
@click="searchByCate({ id: '', labelName: '店铺推荐' })"
|
||||
>
|
||||
首页
|
||||
</li>
|
||||
<li class="cate-item" v-for="(cate, index) in cateList" :key="index">
|
||||
<Dropdown v-if="cate.children.length">
|
||||
<div @click.self="searchByCate(cate)">
|
||||
{{ cate.labelName }}
|
||||
<Icon type="ios-arrow-down"></Icon>
|
||||
</div>
|
||||
<DropdownMenu slot="list">
|
||||
<DropdownItem
|
||||
@click.native="searchByCate(sec)"
|
||||
:name="sec.id"
|
||||
v-for="sec in cate.children"
|
||||
:key="sec.id"
|
||||
>{{ sec.labelName }}
|
||||
</DropdownItem
|
||||
>
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
<span v-else @click.self="searchByCate(cate)">{{
|
||||
cate.labelName
|
||||
}}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="goods-page">
|
||||
<Page
|
||||
show-sizer
|
||||
@on-change="changePageNum"
|
||||
@on-page-size-change="changePageSize"
|
||||
:total="total"
|
||||
:page-size="params.pageSize"
|
||||
></Page>
|
||||
</div>
|
||||
<BaseFooter />
|
||||
|
||||
<div class="promotion-decorate">{{ cateName }}</div>
|
||||
|
||||
<!-- <div class="goods-list">-->
|
||||
<!-- <empty v-if="goodsList.length === 0"/>-->
|
||||
<!-- <div-->
|
||||
<!-- v-else-->
|
||||
<!-- class="goods-show-info"-->
|
||||
<!-- v-for="(item, index) in goodsList"-->
|
||||
<!-- :key="index"-->
|
||||
<!-- @click="goGoodsDetail(item.content.id, item.content.goodsId)"-->
|
||||
<!-- >-->
|
||||
<!-- <div class="goods-show-img">-->
|
||||
<!-- <img width="220" height="220" :src="item.content.thumbnail"/>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="goods-show-price">-->
|
||||
<!-- <span>-->
|
||||
<!-- <span class="seckill-price text-danger">{{-->
|
||||
<!-- item.content.price | unitPrice("¥")-->
|
||||
<!-- }}</span>-->
|
||||
<!-- </span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="goods-show-detail">-->
|
||||
<!-- <span>{{ item.content.goodsName }}</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="goods-show-num">-->
|
||||
<!-- 已有<span>{{ item.content.commentNum || 0 }}</span-->
|
||||
<!-- >人评价-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="goods-page">-->
|
||||
<!-- <Page-->
|
||||
<!-- show-sizer-->
|
||||
<!-- @on-change="changePageNum"-->
|
||||
<!-- @on-page-size-change="changePageSize"-->
|
||||
<!-- :total="total"-->
|
||||
<!-- :page-size="params.pageSize"-->
|
||||
<!-- ></Page>-->
|
||||
<!-- </div>-->
|
||||
<!-- -->
|
||||
|
||||
|
||||
<!-- 楼层装修部分 -->
|
||||
<model-form ref="modelForm" :data="modelForm"></model-form>
|
||||
|
||||
<BaseFooter/>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getDetailById, getCateById} from '@/api/shopentry'
|
||||
import { cancelCollect, collectGoods, isCollection } from '@/api/member';
|
||||
import {goodsList} from '@/api/goods';
|
||||
import { getIMDetail } from "@/api/common";
|
||||
import Storage from "../plugins/storage";
|
||||
import {getDetailById, getCateById} from "@/api/shopentry";
|
||||
import {cancelCollect, collectGoods, isCollection} from "@/api/member";
|
||||
import {goodsList} from "@/api/goods";
|
||||
import Search from "@/components/Search";
|
||||
import ModelForm from "@/components/indexDecorate/ModelForm";
|
||||
import HoverSearch from "@/components/header/hoverSearch";
|
||||
import storage from "@/plugins/storage";
|
||||
import {getFloorStoreData} from "@/api/index.js";
|
||||
import {seckillByDay} from "@/api/promotion";
|
||||
|
||||
export default {
|
||||
name: 'Merchant',
|
||||
data () {
|
||||
name: "Merchant",
|
||||
components: {
|
||||
Search,
|
||||
ModelForm,
|
||||
HoverSearch,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 店铺装修的内容
|
||||
modelForm: {list: []}, // 楼层装修数据
|
||||
topAdvert: {}, // 顶部广告
|
||||
showNav: false, // 是否展示分类栏
|
||||
topSearchShow: false, // 滚动后顶部搜索栏展示
|
||||
carouselLarge: false, // 不同轮播分类尺寸
|
||||
carouselOpacity: false, // 不同轮播分类样式,
|
||||
enablePageData: false, //是否显示楼层装修内容
|
||||
basePageData: false, //基础店铺信息
|
||||
storeMsg: {}, // 店铺信息
|
||||
cateList: [], // 店铺分裂
|
||||
goodsList: [], // 商品列表
|
||||
total: 0, // 商品数量
|
||||
params: { // 请求参数
|
||||
IMLink:"",
|
||||
params: {
|
||||
// 请求参数
|
||||
pageNumber: 1,
|
||||
pageSize: 20,
|
||||
keyword: '',
|
||||
keyword: "",
|
||||
storeId: this.$route.query.id,
|
||||
storeCatId: ''
|
||||
storeCatId: "",
|
||||
},
|
||||
cateName: '店铺推荐', // 分类名称
|
||||
storeCollected: false // 是否收藏
|
||||
}
|
||||
cateName: "店铺推荐", // 分类名称
|
||||
storeCollected: false, // 是否收藏
|
||||
};
|
||||
},
|
||||
created () {
|
||||
this.getStoreMsg()
|
||||
this.getCateList()
|
||||
this.getGoodsList()
|
||||
created() {
|
||||
this.getStoreMsg();
|
||||
},
|
||||
methods: {
|
||||
getIndexData() {
|
||||
// 获取首页装修数据
|
||||
getFloorStoreData({clientType: "PC", num: this.$route.query.id, pageType: 'STORE'}).then(
|
||||
(res) => {
|
||||
if (res.success) {
|
||||
let dataJson = JSON.parse(res.result.pageData);
|
||||
// 秒杀活动不是装修的数据,需要调用接口判断是否有秒杀商品
|
||||
// 轮播图根据不同轮播,样式不同
|
||||
for (let i = 0; i < dataJson.list.length; i++) {
|
||||
let type = dataJson.list[i].type;
|
||||
if (type === "carousel2") {
|
||||
this.carouselLarge = true;
|
||||
} else if (type === "carousel1") {
|
||||
this.carouselLarge = true;
|
||||
this.carouselOpacity = true;
|
||||
}
|
||||
|
||||
// else if (type === "seckill") {
|
||||
// let seckill = this.getListByDay();
|
||||
// dataJson.list[i].options.list = seckill;
|
||||
// }
|
||||
}
|
||||
this.modelForm = dataJson;
|
||||
storage.setItem("navList", dataJson.list[1]);
|
||||
this.showNav = true;
|
||||
this.topAdvert = dataJson.list[0];
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
// 跳转im客服
|
||||
async IMService() {
|
||||
// 获取访问Token
|
||||
let accessToken = Storage.getItem("accessToken");
|
||||
await this.getIMDetailMethods();
|
||||
if (!accessToken) {
|
||||
this.$Message.error("请登录后再联系客服");
|
||||
return;
|
||||
}
|
||||
window.open(
|
||||
this.IMLink +
|
||||
"?token=" +
|
||||
accessToken +
|
||||
"&id=" +
|
||||
this.storeMsg.storeId
|
||||
);
|
||||
},
|
||||
// 获取im信息
|
||||
async getIMDetailMethods() {
|
||||
let res = await getIMDetail();
|
||||
if (res.success) {
|
||||
this.IMLink = res.result;
|
||||
}
|
||||
},
|
||||
getStoreMsg () { // 店铺信息
|
||||
getDetailById(this.$route.query.id).then(res => {
|
||||
if (res.success) {
|
||||
@@ -118,100 +217,144 @@ export default {
|
||||
}
|
||||
})
|
||||
},
|
||||
getCateList () { // 店铺分类
|
||||
getCateById(this.$route.query.id).then(res => {
|
||||
// async getListByDay() {
|
||||
// // 当天秒杀活动
|
||||
// const res = await seckillByDay();
|
||||
// if (res.success && res.result.length) {
|
||||
// return res.result;
|
||||
// } else {
|
||||
// return [];
|
||||
// }
|
||||
// },
|
||||
|
||||
// getStoreMsg() {
|
||||
// // 店铺信息
|
||||
// getDetailById(this.$route.query.id).then((res) => {
|
||||
// if (res.success) {
|
||||
//
|
||||
// this.storeMsg = res.result;
|
||||
//
|
||||
//
|
||||
// this.getIndexData();
|
||||
// let that = this;
|
||||
// window.onscroll = function () {
|
||||
// let top =
|
||||
// document.documentElement.scrollTop || document.body.scrollTop;
|
||||
// if (top > 300) {
|
||||
// that.topSearchShow = true;
|
||||
// } else {
|
||||
// that.topSearchShow = false;
|
||||
// }
|
||||
// };
|
||||
// }
|
||||
// });
|
||||
// },
|
||||
getCateList() {
|
||||
// 店铺分类
|
||||
getCateById(this.$route.query.id).then((res) => {
|
||||
if (res.success) {
|
||||
this.cateList = res.result
|
||||
this.cateList = res.result;
|
||||
}
|
||||
})
|
||||
},
|
||||
getGoodsList () { // 商品信息
|
||||
goodsList(this.params).then((res) => {
|
||||
if (res.success) {
|
||||
this.goodsList = res.result.content;
|
||||
this.total = res.result.totalElements;
|
||||
}
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
goGoodsDetail (skuId, goodsId) {
|
||||
getGoodsList() {
|
||||
// 商品信息
|
||||
goodsList(this.params)
|
||||
.then((res) => {
|
||||
if (res.success) {
|
||||
this.goodsList = res.result.content;
|
||||
this.total = res.result.totalElements;
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
});
|
||||
},
|
||||
goGoodsDetail(skuId, goodsId) {
|
||||
// 跳转商品详情
|
||||
let routeUrl = this.$router.resolve({
|
||||
path: '/goodsDetail',
|
||||
query: { skuId, goodsId }
|
||||
path: "/goodsDetail",
|
||||
query: {skuId, goodsId},
|
||||
});
|
||||
window.open(routeUrl.href, '_blank');
|
||||
window.open(routeUrl.href, "_blank");
|
||||
},
|
||||
search (val) { // 搜索本店商品
|
||||
search(val) {
|
||||
// 搜索本店商品
|
||||
console.log(val);
|
||||
this.params.keyword = val
|
||||
this.getGoodsList()
|
||||
this.params.keyword = val;
|
||||
this.getGoodsList();
|
||||
},
|
||||
searchByCate (cate) { // 搜索同分类下商品
|
||||
this.params.storeCatId = cate.id
|
||||
this.cateName = cate.labelName
|
||||
this.getGoodsList()
|
||||
searchByCate(cate) {
|
||||
// 搜索同分类下商品
|
||||
this.params.storeCatId = cate.id;
|
||||
this.cateName = cate.labelName;
|
||||
this.getGoodsList();
|
||||
},
|
||||
// 分页 修改页码
|
||||
changePageNum (val) {
|
||||
changePageNum(val) {
|
||||
this.params.pageNumber = val;
|
||||
this.getGoodsList();
|
||||
},
|
||||
// 分页 修改页数
|
||||
changePageSize (val) {
|
||||
changePageSize(val) {
|
||||
this.params.pageNumber = 1;
|
||||
this.params.pageSize = val;
|
||||
this.getGoodsList();
|
||||
},
|
||||
async collect () { // 收藏店铺
|
||||
async collect() {
|
||||
// 收藏店铺
|
||||
if (this.storeCollected) {
|
||||
let cancel = await cancelCollect('STORE', this.storeMsg.storeId)
|
||||
let cancel = await cancelCollect("STORE", this.storeMsg.storeId);
|
||||
if (cancel.success) {
|
||||
this.$Message.success('已取消收藏')
|
||||
this.$Message.success("已取消收藏");
|
||||
this.storeCollected = false;
|
||||
}
|
||||
} else {
|
||||
let collect = await collectGoods('STORE', this.storeMsg.storeId);
|
||||
let collect = await collectGoods("STORE", this.storeMsg.storeId);
|
||||
if (collect.code === 200) {
|
||||
this.storeCollected = true;
|
||||
this.$Message.success('收藏店铺成功,可以前往个人中心我的收藏查看');
|
||||
this.$Message.success("收藏店铺成功,可以前往个人中心我的收藏查看");
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import '../assets/styles/goodsList.scss';
|
||||
@import "../assets/styles/goodsList.scss";
|
||||
|
||||
.merchant {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.shop-logo {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
background-color: #666;
|
||||
padding: 4px;
|
||||
color: #fff;
|
||||
>div{
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
align-items: center;
|
||||
|
||||
>div:nth-child(2){
|
||||
> div:nth-child(2) {
|
||||
margin-left: 10px;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
>div:nth-child(3){
|
||||
> div:nth-child(3) {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
p:nth-child(1) {
|
||||
font-size: 20px;
|
||||
}
|
||||
p:nth-child(2){
|
||||
|
||||
p:nth-child(2) {
|
||||
font-size: 14px;
|
||||
max-height: 40px;
|
||||
max-width: 400px;
|
||||
@@ -221,22 +364,27 @@ export default {
|
||||
.store-category {
|
||||
background-color: #005aa0;
|
||||
color: #fff;
|
||||
.cate-list{
|
||||
|
||||
.cate-list {
|
||||
width: 1200px;
|
||||
margin: 0 auto ;
|
||||
margin: 0 auto;
|
||||
clear: left;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
|
||||
.cate-item {
|
||||
margin-right: 25px;
|
||||
float: left;
|
||||
}
|
||||
.cate-item:hover{
|
||||
|
||||
.cate-item:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.promotion-decorate::before,.promotion-decorate::after{
|
||||
background-image: url('/src/assets/images/sprite@2x.png');
|
||||
|
||||
.promotion-decorate::before,
|
||||
.promotion-decorate::after {
|
||||
background-image: url("/src/assets/images/sprite@2x.png");
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,182 +1,329 @@
|
||||
<template>
|
||||
<div class='wrapper'>
|
||||
<card _Title='我的分销'/>
|
||||
<!-- 分销申请 -->
|
||||
<div v-if="status === 0">
|
||||
<Alert type="warning">分销商申请</Alert>
|
||||
<Form ref="form" :model="applyForm" :rules="rules">
|
||||
<FormItem label="姓名" prop="name">
|
||||
<Input v-model="applyForm.name"></Input>
|
||||
</FormItem>
|
||||
<FormItem label="身份证号" prop="idNumber">
|
||||
<Input v-model="applyForm.idNumber"></Input>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<Button type="primary" :loading="applyLoading" @click="apply">提交申请</Button>
|
||||
</FormItem>
|
||||
</Form>
|
||||
</div>
|
||||
<!-- 分销审核 -->
|
||||
<div v-if="status === 1">
|
||||
<Alert type="success">
|
||||
您提交的信息正在审核
|
||||
<template slot="desc">提交认证申请后,工作人员将在三个工作日进行核对完成审核</template>
|
||||
</Alert>
|
||||
</div>
|
||||
<!-- 分销提现、商品、订单 -->
|
||||
<div v-if="status === 2">
|
||||
<div class="box">
|
||||
<div class="mb_20 account-price">
|
||||
<span class="subTips">可提现金额:</span>
|
||||
<span class="fontsize_48 global_color">¥{{ result.canRebate | unitPrice }}</span>
|
||||
<span class="subTips">冻结金额:</span>
|
||||
<span class="">¥{{ result.commissionFrozen | unitPrice }}</span>
|
||||
<Button type="primary" size="small" class="ml_20" @click="withdrawApplyModal = true">申请提现</Button>
|
||||
</div>
|
||||
</div>
|
||||
<Tabs :value="tabName" @on-click="tabPaneChange">
|
||||
<TabPane label="已选商品" name="goodsChecked">
|
||||
<Table stripe :columns="goodsColumns" :data="goodsData.records">
|
||||
<template slot-scope="{ row }" slot="name">
|
||||
<div class="goods-msg" @click="linkTo(`/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}`)"><img style="vertical-align:top;" :src="row.thumbnail" width="60" height="60" alt=""> {{row.goodsName}}</div>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="price">
|
||||
<span> ¥{{ row.price | unitPrice }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="commission">
|
||||
<span> ¥{{ row.commission | unitPrice }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="action">
|
||||
<Button type="success" size="small" style="margin-right: 5px" @click="fenxiao(row)">分销商品</Button>
|
||||
<Button type="error" size="small" @click="selectGoods(row.id, false)">取消选择</Button>
|
||||
</template>
|
||||
</Table>
|
||||
<div class="page-size">
|
||||
<Page
|
||||
:current="params.pageNumber"
|
||||
:total="goodsData.total"
|
||||
:page-size="params.pageSize"
|
||||
@on-change="changePage"
|
||||
size="small"
|
||||
show-total
|
||||
show-elevator
|
||||
></Page>
|
||||
</div>
|
||||
</TabPane>
|
||||
<TabPane label="未选商品" name="goodsUncheck">
|
||||
<Table stripe :columns="goodsColumns" :data="goodsData.records">
|
||||
<template slot-scope="{ row }" slot="name">
|
||||
<div class="goods-msg" @click="linkTo(`/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}`)"><img style="vertical-align:top;" :src="row.thumbnail" width="60" height="60" alt=""> {{row.goodsName}}</div>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="price">
|
||||
<span> ¥{{ row.price | unitPrice }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="commission">
|
||||
<span> ¥{{ row.commission | unitPrice }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="action">
|
||||
<Button type="primary" size="small" style="margin-right: 5px" @click="selectGoods(row.id, true)">选择商品</Button>
|
||||
</template>
|
||||
</Table>
|
||||
<div class="page-size">
|
||||
<Page
|
||||
:current="params.pageNumber"
|
||||
:total="goodsData.total"
|
||||
:page-size="params.pageSize"
|
||||
@on-change="changePage"
|
||||
size="small"
|
||||
show-total
|
||||
show-elevator
|
||||
></Page>
|
||||
</div>
|
||||
</TabPane>
|
||||
<TabPane label="提现记录" name="log">
|
||||
<Table stripe :columns="logColumns" :data="logData.records">
|
||||
<template slot-scope="{ row }" slot="sn">
|
||||
<span>{{row.sn}}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="time">
|
||||
<span>{{row.createTime}}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="price">
|
||||
<span v-if="row.distributionCashStatus == 'REFUSE'" style="color: green"> +¥{{ row.price | unitPrice }}</span>
|
||||
<span v-else style="color: red"> -¥{{ row.price | unitPrice }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="status">
|
||||
<span> {{row.distributionCashStatus == "APPLY" ? "待处理" : row.distributionCashStatus == "PASS" ? "通过" : "拒绝"}}</span>
|
||||
</template>
|
||||
</Table>
|
||||
<div class="page-size">
|
||||
<Page
|
||||
:current="logParams.pageNumber"
|
||||
:total="logData.total"
|
||||
:page-size="logParams.pageSize"
|
||||
@on-change="changePageLog"
|
||||
size="small"
|
||||
show-total
|
||||
show-elevator
|
||||
></Page>
|
||||
</div>
|
||||
</TabPane>
|
||||
</Tabs>
|
||||
</div>
|
||||
<!-- 未开放 -->
|
||||
<div v-if="status === 3">
|
||||
<Alert type="error">
|
||||
分销功能暂未开启
|
||||
<template slot="desc">提交认证申请后,工作人员将在三个工作日进行核对完成审核</template>
|
||||
</Alert>
|
||||
<div class="wrapper">
|
||||
<card _Title="我的分销" />
|
||||
<!-- 分销申请 -->
|
||||
|
||||
<div v-if="status === 0">
|
||||
<Alert type="warning">分销商申请</Alert>
|
||||
<Form ref="form" :model="applyForm" :rules="rules">
|
||||
<FormItem label="姓名" prop="name">
|
||||
<Input v-model="applyForm.name"></Input>
|
||||
</FormItem>
|
||||
<FormItem label="身份证号" prop="idNumber">
|
||||
<Input v-model="applyForm.idNumber"></Input>
|
||||
</FormItem>
|
||||
<FormItem label="银行开户行" prop="settlementBankBranchName">
|
||||
<Input v-model="applyForm.settlementBankBranchName"></Input>
|
||||
</FormItem>
|
||||
<FormItem label="银行开户名" prop="settlementBankAccountName">
|
||||
<Input v-model="applyForm.settlementBankAccountName"></Input>
|
||||
</FormItem>
|
||||
<FormItem label="银行账号" prop="settlementBankAccountNum">
|
||||
<Input v-model="applyForm.settlementBankAccountNum"></Input>
|
||||
</FormItem>
|
||||
|
||||
<FormItem>
|
||||
<Button type="primary" :loading="applyLoading" @click="apply"
|
||||
>提交申请</Button
|
||||
>
|
||||
</FormItem>
|
||||
</Form>
|
||||
</div>
|
||||
<!-- 分销审核 -->
|
||||
<div v-if="status === 1">
|
||||
<Alert type="success">
|
||||
您提交的信息正在审核
|
||||
<template slot="desc"
|
||||
>提交认证申请后,工作人员将在三个工作日进行核对完成审核</template
|
||||
>
|
||||
</Alert>
|
||||
</div>
|
||||
<!-- 分销提现、商品、订单 -->
|
||||
<div v-if="status === 2">
|
||||
<div class="tips">
|
||||
|
||||
<p>分销下线付款之后会生成分销订单。</p>
|
||||
<p>
|
||||
冻结金额:用户提现金额即为冻结金额,审核通过后扣除冻结金额,审核拒绝之后冻结金额返回可提现金额。
|
||||
</p>
|
||||
<p>可提现金额:分销订单佣金T+1解冻后可变为可提现金额。</p>
|
||||
|
||||
</div>
|
||||
|
||||
<Modal v-model="withdrawApplyModal" width="530">
|
||||
<p slot="header">
|
||||
<Icon type="edit"></Icon>
|
||||
<span>提现金额</span>
|
||||
</p>
|
||||
<div>
|
||||
<Input
|
||||
v-model="withdrawPrice"
|
||||
size="large"
|
||||
number
|
||||
maxlength="9"
|
||||
><span slot="append">元</span></Input>
|
||||
<div class="box">
|
||||
<div class="mb_20 account-price">
|
||||
<span class="subTips">可提现金额:</span>
|
||||
<span class="fontsize_48 global_color"
|
||||
>¥{{ result.canRebate | unitPrice }}</span
|
||||
>
|
||||
<span class="subTips">冻结金额:</span>
|
||||
<span class="">¥{{ result.commissionFrozen | unitPrice }}</span>
|
||||
<span class="subTips">返利总金额:</span>
|
||||
<span class="">¥{{ result.rebateTotal | unitPrice }}</span>
|
||||
<Button
|
||||
type="primary"
|
||||
size="small"
|
||||
class="ml_20"
|
||||
@click="withdrawApplyModal = true"
|
||||
>申请提现</Button
|
||||
>
|
||||
</div>
|
||||
<div slot="footer" style="text-align: center">
|
||||
<Button type="primary" size="large" @click="withdraw">提现</Button>
|
||||
</div>
|
||||
</Modal>
|
||||
<Modal v-model="qrcodeShow" title="分销商品" width="800">
|
||||
<Alert type="warning">
|
||||
下载二维码或者复制链接分享商品
|
||||
</Alert>
|
||||
<div style="width:200px;height:200px;border:1px solid #eee;">
|
||||
<vue-qr :text="qrcode" :callback="qrcodeData" :margin="0" colorDark="#000" colorLight="#fff" :size="200"></vue-qr>
|
||||
<Button class="download-btn" type="success" @click="downloadQrcode">下载二维码</Button>
|
||||
</div>
|
||||
<div class="mt_10">商品链接:<Input style="width:400px" v-model="qrcode"></Input></div>
|
||||
</Modal>
|
||||
</div>
|
||||
<Tabs :value="tabName" @on-click="tabPaneChange">
|
||||
<TabPane label="已选商品" name="goodsChecked">
|
||||
<Table stripe :columns="goodsColumns" :data="goodsData.records">
|
||||
<template slot-scope="{ row }" slot="name">
|
||||
<div
|
||||
class="goods-msg"
|
||||
@click="
|
||||
linkTo(
|
||||
`/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}`
|
||||
)
|
||||
"
|
||||
>
|
||||
<img
|
||||
style="vertical-align: top"
|
||||
:src="row.thumbnail"
|
||||
width="60"
|
||||
height="60"
|
||||
alt=""
|
||||
/> {{ row.goodsName }}
|
||||
</div>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="price">
|
||||
<span> ¥{{ row.price | unitPrice }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="commission">
|
||||
<span> ¥{{ row.commission | unitPrice }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="action">
|
||||
<Button
|
||||
type="success"
|
||||
size="small"
|
||||
style="margin-right: 5px"
|
||||
@click="fenxiao(row)"
|
||||
>分销商品</Button
|
||||
>
|
||||
<Button
|
||||
type="error"
|
||||
size="small"
|
||||
@click="selectGoods(row.id, false)"
|
||||
>取消选择</Button
|
||||
>
|
||||
</template>
|
||||
</Table>
|
||||
<div class="page-size">
|
||||
<Page
|
||||
:current="params.pageNumber"
|
||||
:total="goodsData.total"
|
||||
:page-size="params.pageSize"
|
||||
@on-change="changePage"
|
||||
size="small"
|
||||
show-total
|
||||
show-elevator
|
||||
></Page>
|
||||
</div>
|
||||
</TabPane>
|
||||
<TabPane label="未选商品" name="goodsUncheck">
|
||||
<Table stripe :columns="goodsColumns" :data="goodsData.records">
|
||||
<template slot-scope="{ row }" slot="name">
|
||||
<div
|
||||
class="goods-msg"
|
||||
@click="
|
||||
linkTo(
|
||||
`/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}`
|
||||
)
|
||||
"
|
||||
>
|
||||
<img
|
||||
style="vertical-align: top"
|
||||
:src="row.thumbnail"
|
||||
width="60"
|
||||
height="60"
|
||||
alt=""
|
||||
/> {{ row.goodsName }}
|
||||
</div>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="price">
|
||||
<span> ¥{{ row.price | unitPrice }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="commission">
|
||||
<span> ¥{{ row.commission | unitPrice }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="action">
|
||||
<Button
|
||||
type="primary"
|
||||
size="small"
|
||||
style="margin-right: 5px"
|
||||
@click="selectGoods(row.id, true)"
|
||||
>选择商品</Button
|
||||
>
|
||||
</template>
|
||||
</Table>
|
||||
<div class="page-size">
|
||||
<Page
|
||||
:current="params.pageNumber"
|
||||
:total="goodsData.total"
|
||||
:page-size="params.pageSize"
|
||||
@on-change="changePage"
|
||||
size="small"
|
||||
show-total
|
||||
show-elevator
|
||||
></Page>
|
||||
</div>
|
||||
</TabPane>
|
||||
<TabPane label="提现记录" name="log">
|
||||
<Table stripe :columns="logColumns" :data="logData.records">
|
||||
<template slot-scope="{ row }" slot="sn">
|
||||
<span>{{ row.sn }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="time">
|
||||
<span>{{ row.createTime }}</span>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="price">
|
||||
<span
|
||||
v-if="row.distributionCashStatus == 'VIA_AUDITING'"
|
||||
style="color: green"
|
||||
>
|
||||
+¥{{ row.price | unitPrice }}</span
|
||||
>
|
||||
<span v-else style="color: red">
|
||||
-¥{{ row.price | unitPrice }}</span
|
||||
>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="status">
|
||||
<span>
|
||||
{{
|
||||
row.distributionCashStatus == "APPLY"
|
||||
? "待处理"
|
||||
: row.distributionCashStatus == "VIA_AUDITING"
|
||||
? "通过"
|
||||
: "拒绝"
|
||||
}}</span
|
||||
>
|
||||
</template>
|
||||
</Table>
|
||||
<div class="page-size">
|
||||
<Page
|
||||
:current="logParams.pageNumber"
|
||||
:total="logData.total"
|
||||
:page-size="logParams.pageSize"
|
||||
@on-change="changePageLog"
|
||||
size="small"
|
||||
show-total
|
||||
show-elevator
|
||||
></Page>
|
||||
</div>
|
||||
</TabPane>
|
||||
</Tabs>
|
||||
</div>
|
||||
<!-- 未开放 -->
|
||||
<div v-if="status === 3">
|
||||
<Alert type="error">
|
||||
分销功能暂未开启
|
||||
<template slot="desc"
|
||||
>提交认证申请后,工作人员将在三个工作日进行核对完成审核</template
|
||||
>
|
||||
</Alert>
|
||||
</div>
|
||||
|
||||
<Modal v-model="withdrawApplyModal" width="530">
|
||||
<p slot="header">
|
||||
<Icon type="edit"></Icon>
|
||||
<span>提现金额</span>
|
||||
</p>
|
||||
<div>
|
||||
<Input v-model="withdrawPrice" size="large" number maxlength="9"
|
||||
><span slot="append">元</span></Input
|
||||
>
|
||||
</div>
|
||||
<div slot="footer" style="text-align: center">
|
||||
<Button type="primary" size="large" @click="withdraw">提现</Button>
|
||||
</div>
|
||||
</Modal>
|
||||
<Modal v-model="qrcodeShow" title="分销商品" width="800">
|
||||
<Alert type="warning"> 下载二维码或者复制链接分享商品 </Alert>
|
||||
<div style="width: 200px; height: 200px; border: 1px solid #eee">
|
||||
<vue-qr
|
||||
:text="qrcode"
|
||||
:callback="qrcodeData"
|
||||
:margin="0"
|
||||
colorDark="#000"
|
||||
colorLight="#fff"
|
||||
:size="200"
|
||||
></vue-qr>
|
||||
<Button class="download-btn" type="success" @click="downloadQrcode"
|
||||
>下载二维码</Button
|
||||
>
|
||||
</div>
|
||||
<div class="mt_10">
|
||||
商品链接:<Input style="width: 400px" v-model="qrcode"></Input>
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {distribution, applyDistribution, distCash, distCashHistory, getDistGoodsList, selectDistGoods} from '@/api/member.js'
|
||||
import { IDCard } from '@/plugins/RegExp.js';
|
||||
import vueQr from 'vue-qr';
|
||||
import {
|
||||
distribution,
|
||||
applyDistribution,
|
||||
distCash,
|
||||
distCashHistory,
|
||||
getDistGoodsList,
|
||||
selectDistGoods,
|
||||
} from "@/api/member.js";
|
||||
import { IDCard } from "@/plugins/RegExp.js";
|
||||
import { checkBankno } from "@/plugins/Foundation";
|
||||
import vueQr from "vue-qr";
|
||||
export default {
|
||||
name: 'Distribution',
|
||||
name: "Distribution",
|
||||
components: { vueQr },
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
status: 0, // 申请状态,0为未申请 1 申请中 2 申请完成 3 功能暂未开启
|
||||
applyForm: {}, // 申请表单
|
||||
rules: { // 验证规则
|
||||
name: [{required: true, message: '请输入真实姓名'}],
|
||||
rules: {
|
||||
// 验证规则
|
||||
name: [{ required: true, message: "请输入真实姓名" }],
|
||||
idNumber: [
|
||||
{required: true, message: '请输入身份证号'},
|
||||
{pattern: IDCard, message: '请输入正确的身份证号'}
|
||||
]
|
||||
{ required: true, message: "请输入身份证号" },
|
||||
{ pattern: IDCard, message: "请输入正确的身份证号" },
|
||||
],
|
||||
settlementBankBranchName: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入银行开户行",
|
||||
// 可以单个或者同时写两个触发验证方式
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
settlementBankAccountName: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入银行开户名",
|
||||
// 可以单个或者同时写两个触发验证方式
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
//银行账号
|
||||
settlementBankAccountNum: [
|
||||
{
|
||||
required: true,
|
||||
message: "银行账号不正确",
|
||||
// 可以单个或者同时写两个触发验证方式
|
||||
trigger: "blur",
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
// 上面有说,返回true表示校验通过,返回false表示不通过
|
||||
// this.$u.test.mobile()就是返回true或者false的
|
||||
return checkBankno(value);
|
||||
},
|
||||
message: "银行账号不正确",
|
||||
},
|
||||
],
|
||||
},
|
||||
tabName: 'goodsChecked', // 当前所在tab
|
||||
tabName: "goodsChecked", // 当前所在tab
|
||||
result: {}, // 审核结果
|
||||
applyLoading: false, // 申请加载状态
|
||||
goodsLoading: false, // 列表加载状态
|
||||
@@ -184,136 +331,155 @@ export default {
|
||||
withdrawPrice: 0, // 提现金额
|
||||
goodsData: {}, // 商品数据
|
||||
logData: {}, // 日志数据
|
||||
goodsColumns: [ // 商品表头
|
||||
{title: '商品名称', slot: 'name', width: 400},
|
||||
{title: '商品价格', slot: 'price'},
|
||||
{title: '佣金', slot: 'commission'},
|
||||
{title: '操作', slot: 'action', minWidth: 120}
|
||||
goodsColumns: [
|
||||
// 商品表头
|
||||
{ title: "商品名称", slot: "name", width: 400 },
|
||||
{ title: "商品价格", slot: "price" },
|
||||
{ title: "佣金", slot: "commission" },
|
||||
{ title: "操作", slot: "action", minWidth: 120 },
|
||||
],
|
||||
logColumns: [ // 日志表头
|
||||
{title: '编号', slot: 'sn'},
|
||||
{title: '申请时间', slot: 'time'},
|
||||
{title: '提现金额', slot: 'price'},
|
||||
{title: '提现状态', slot: 'status'}
|
||||
logColumns: [
|
||||
// 日志表头
|
||||
{ title: "编号", slot: "sn" },
|
||||
{ title: "申请时间", slot: "time" },
|
||||
{ title: "提现金额", slot: "price" },
|
||||
{ title: "提现状态", slot: "status" },
|
||||
],
|
||||
params: { // 商品请求参数
|
||||
params: {
|
||||
// 商品请求参数
|
||||
pageNumber: 1,
|
||||
pageSize: 20,
|
||||
checked: true
|
||||
checked: true,
|
||||
},
|
||||
orderParams: { // 订单商品请求参数
|
||||
orderParams: {
|
||||
// 订单商品请求参数
|
||||
pageNumber: 1,
|
||||
pageSize: 20
|
||||
pageSize: 20,
|
||||
},
|
||||
logParams: { // 日志参数
|
||||
logParams: {
|
||||
// 日志参数
|
||||
pageNumber: 1,
|
||||
pageSize: 20
|
||||
pageSize: 20,
|
||||
sort: "createTime",
|
||||
order: "desc",
|
||||
},
|
||||
qrcode: '', // 二维码
|
||||
qrcode: "", // 二维码
|
||||
qrcodeShow: false, // 显示二维码
|
||||
base64Img: '', // base64编码
|
||||
goodsNameCurr: ''// 当前分销商品名称
|
||||
}
|
||||
base64Img: "", // base64编码
|
||||
goodsNameCurr: "", // 当前分销商品名称
|
||||
};
|
||||
},
|
||||
mounted () {
|
||||
this.distribution()
|
||||
mounted() {
|
||||
this.distribution();
|
||||
},
|
||||
methods: {
|
||||
apply () { // 申请成为分销商
|
||||
this.$refs.form.validate(valid => {
|
||||
apply() {
|
||||
// 申请成为分销商
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.applyLoading = true
|
||||
applyDistribution(this.form).then(res => {
|
||||
this.applyLoading = false
|
||||
this.applyLoading = true;
|
||||
applyDistribution(this.form).then((res) => {
|
||||
this.applyLoading = false;
|
||||
if (res.success) {
|
||||
this.$Message.success('申请已提交,请等待管理员审核')
|
||||
this.$Message.success("申请已提交,请等待管理员审核");
|
||||
this.status = 1;
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
withdraw () { // 申请提现
|
||||
distCash({price: this.withdrawPrice}).then(res => {
|
||||
this.withdrawApplyModal = false
|
||||
withdraw() {
|
||||
// 申请提现
|
||||
distCash({ price: this.withdrawPrice }).then((res) => {
|
||||
this.withdrawApplyModal = false;
|
||||
this.price = 0;
|
||||
if (res.success) {
|
||||
this.$Message.success('申请已提交,请等待审核')
|
||||
this.distribution()
|
||||
this.getLog()
|
||||
this.$Message.success("申请已提交,请等待审核");
|
||||
this.distribution();
|
||||
this.getLog();
|
||||
} else {
|
||||
this.$Message.error(res.message)
|
||||
this.$Message.error(res.message);
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
qrcodeData (data64) { // 二维码base64地址
|
||||
this.base64Img = data64
|
||||
qrcodeData(data64) {
|
||||
// 二维码base64地址
|
||||
this.base64Img = data64;
|
||||
},
|
||||
downloadQrcode () { // 下载二维码
|
||||
let a = document.createElement('a'); // 生成一个a元素
|
||||
let event = new MouseEvent('click'); // 创建一个单击事件
|
||||
a.download = this.goodsNameCurr || 'photo'
|
||||
downloadQrcode() {
|
||||
// 下载二维码
|
||||
let a = document.createElement("a"); // 生成一个a元素
|
||||
let event = new MouseEvent("click"); // 创建一个单击事件
|
||||
a.download = this.goodsNameCurr || "photo";
|
||||
a.href = this.base64Img; // 将生成的URL设置为a.href属性
|
||||
a.dispatchEvent(event); // 触发a的单击事件
|
||||
},
|
||||
tabPaneChange (tab) { // tab栏切换
|
||||
if (tab === 'goodsChecked') {
|
||||
tabPaneChange(tab) {
|
||||
// tab栏切换
|
||||
if (tab === "goodsChecked") {
|
||||
this.params.checked = true;
|
||||
this.params.pageNUmber = 1
|
||||
this.getGoodsData()
|
||||
} else if (tab === 'goodsUncheck') {
|
||||
this.params.checked = false
|
||||
this.getGoodsData()
|
||||
} else if (tab === 'log') {
|
||||
this.logParams.pageNumber = 1
|
||||
this.getLog()
|
||||
this.params.pageNUmber = 1;
|
||||
this.getGoodsData();
|
||||
} else if (tab === "goodsUncheck") {
|
||||
this.params.checked = false;
|
||||
this.getGoodsData();
|
||||
} else if (tab === "log") {
|
||||
this.logParams.pageNumber = 1;
|
||||
this.getLog();
|
||||
}
|
||||
},
|
||||
changePage (val) { // 修改页码
|
||||
changePage(val) {
|
||||
// 修改页码
|
||||
this.params.pageNumber = val;
|
||||
this.getGoodsData()
|
||||
this.getGoodsData();
|
||||
},
|
||||
changePageLog (val) { // 修改页码 日志
|
||||
changePageLog(val) {
|
||||
// 修改页码 日志
|
||||
this.logParams.pageNumber = val;
|
||||
this.getLog()
|
||||
this.getLog();
|
||||
},
|
||||
selectGoods (id, checked) { // 选择商品
|
||||
selectGoods(id, checked) {
|
||||
// 选择商品
|
||||
let params = {
|
||||
distributionGoodsId: id,
|
||||
checked: checked
|
||||
}
|
||||
selectDistGoods(params).then(res => {
|
||||
checked: checked,
|
||||
};
|
||||
selectDistGoods(params).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success('操作成功!')
|
||||
this.getGoodsData()
|
||||
this.$Message.success("操作成功!");
|
||||
this.getGoodsData();
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
fenxiao (row) { // 分销商品
|
||||
this.qrcode = `${location.origin}/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}&distributionId=${this.result.id}`
|
||||
this.goodsNameCurr = row.goodsName
|
||||
fenxiao(row) {
|
||||
// 分销商品
|
||||
this.qrcode = `${location.origin}/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}&distributionId=${this.result.id}`;
|
||||
this.goodsNameCurr = row.goodsName;
|
||||
this.qrcodeShow = true;
|
||||
},
|
||||
getGoodsData () { // 商品数据
|
||||
getDistGoodsList(this.params).then(res => {
|
||||
if (res.success) this.goodsData = res.result
|
||||
})
|
||||
getGoodsData() {
|
||||
// 商品数据
|
||||
getDistGoodsList(this.params).then((res) => {
|
||||
if (res.success) this.goodsData = res.result;
|
||||
});
|
||||
},
|
||||
getLog () { // 提现历史
|
||||
distCashHistory(this.logParams).then(res => {
|
||||
if (res.success) this.logData = res.result
|
||||
})
|
||||
getLog() {
|
||||
// 提现历史
|
||||
distCashHistory(this.logParams).then((res) => {
|
||||
if (res.success) this.logData = res.result;
|
||||
});
|
||||
},
|
||||
distribution () { // 获取分销商信息
|
||||
distribution() {
|
||||
// 获取分销商信息
|
||||
distribution().then((res) => {
|
||||
if (res.result) {
|
||||
this.result = res.result;
|
||||
let type = res.result.distributionStatus;
|
||||
|
||||
if (type === 'PASS') {
|
||||
if (type === "PASS") {
|
||||
this.status = 2;
|
||||
this.getGoodsData()
|
||||
} else if (type === 'RETREAT' || type === 'REFUSE') {
|
||||
this.getGoodsData();
|
||||
} else if (type === "RETREAT" || type === "REFUSE") {
|
||||
this.status = 0;
|
||||
} else {
|
||||
this.status = 1;
|
||||
@@ -322,15 +488,15 @@ export default {
|
||||
this.status = 3;
|
||||
} else {
|
||||
// 没有资格申请 先去实名认证
|
||||
this.status = 0
|
||||
this.status = 0;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang='scss'>
|
||||
<style scoped lang="scss">
|
||||
.box {
|
||||
margin: 20px 0;
|
||||
}
|
||||
@@ -347,11 +513,11 @@ export default {
|
||||
.fontsize_48 {
|
||||
font-size: 48px;
|
||||
}
|
||||
.goods-msg{
|
||||
.goods-msg {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 3px;
|
||||
&:hover{
|
||||
&:hover {
|
||||
color: $theme_color;
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -361,4 +527,17 @@ export default {
|
||||
top: -200px;
|
||||
left: 200px;
|
||||
}
|
||||
/depp/ .ivu-alert-message {
|
||||
p {
|
||||
margin: 4px 0;
|
||||
}
|
||||
}
|
||||
.tips{
|
||||
background:#f7f7f7;
|
||||
padding: 16px;
|
||||
border-radius: .4em;
|
||||
>p{
|
||||
margin: 6px 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -3,8 +3,9 @@
|
||||
<div class="title">
|
||||
<card _Title="评价详情" :_Size="16"></card>
|
||||
<p>
|
||||
<span class="color999">创建人:</span><span>{{orderGoods.createBy | secrecyMobile}}</span>
|
||||
<span class="color999 ml_20">{{orderGoods.createTime}}</span>
|
||||
<span class="color999">创建人:</span
|
||||
><span>{{ orderGoods.createBy | secrecyMobile }}</span>
|
||||
<span class="color999 ml_20">{{ orderGoods.createTime }}</span>
|
||||
</p>
|
||||
</div>
|
||||
<!-- 物流评分、服务评分 -->
|
||||
@@ -13,31 +14,64 @@
|
||||
<div class="color999">
|
||||
<span>物流评价:<Rate disabled :value="Number(orderGoods.deliveryScore)" /></span>
|
||||
<span>服务评价:<Rate disabled :value="Number(orderGoods.serviceScore)" /></span>
|
||||
<span>服务评价:<Rate disabled :value="Number(orderGoods.descriptionScore)" /></span>
|
||||
<span
|
||||
>服务评价:<Rate disabled :value="Number(orderGoods.descriptionScore)"
|
||||
/></span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 添加订单评价 左侧商品详情 右侧评价框 -->
|
||||
<ul class="goods-eval">
|
||||
<li >
|
||||
<li>
|
||||
<div class="goods-con">
|
||||
<img :src="orderGoods.goodsImage" class="hover-pointer" alt="" width="100" @click="goGoodsDetail(orderGoods.skuId, orderGoods.goodsId)">
|
||||
<p class="hover-pointer color999" @click="goGoodsDetail(orderGoods.skuId, orderGoods.goodsId)">{{orderGoods.goodsName}}</p>
|
||||
<img
|
||||
:src="orderGoods.goodsImage"
|
||||
class="hover-pointer"
|
||||
alt=""
|
||||
width="100"
|
||||
@click="goGoodsDetail(orderGoods.skuId, orderGoods.goodsId)"
|
||||
/>
|
||||
<p
|
||||
class="hover-pointer color999"
|
||||
@click="goGoodsDetail(orderGoods.skuId, orderGoods.goodsId)"
|
||||
>
|
||||
{{ orderGoods.goodsName }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="eval-con">
|
||||
<div>
|
||||
<span class="color999">商品评价:</span>
|
||||
<RadioGroup style="margin-bottom:5px;color:#999" v-model="orderGoods.grade" type="button" button-style="solid">
|
||||
<RadioGroup
|
||||
style="margin-bottom: 5px; color: #999"
|
||||
v-model="orderGoods.grade"
|
||||
type="button"
|
||||
button-style="solid"
|
||||
>
|
||||
<Radio label="GOOD" disabled>好评</Radio>
|
||||
<Radio label="MODERATE" disabled>中评</Radio>
|
||||
<Radio label="WORSE" disabled>差评</Radio>
|
||||
</RadioGroup>
|
||||
<Input type="textarea" maxlength="500" readonly show-word-limit :rows="4" v-model="orderGoods.content" />
|
||||
<Input
|
||||
type="textarea"
|
||||
maxlength="500"
|
||||
readonly
|
||||
show-word-limit
|
||||
:rows="4"
|
||||
v-model="orderGoods.content"
|
||||
/>
|
||||
</div>
|
||||
<div style="display:flex;align-items:center;">
|
||||
<div>
|
||||
<span class="color999">商家回复:</span>
|
||||
<span>{{ orderGoods.reply }}</span>
|
||||
</div>
|
||||
<div style="display: flex; align-items: center">
|
||||
<template v-if="orderGoods.images">
|
||||
<div class="demo-upload-list" v-for="(img, index) in orderGoods.images.split(',')" :key="index">
|
||||
<img :src="img">
|
||||
<div
|
||||
class="demo-upload-list"
|
||||
v-for="(img, index) in orderGoods.images.split(',')"
|
||||
:key="index"
|
||||
>
|
||||
<img :src="img" />
|
||||
<div class="demo-upload-list-cover">
|
||||
<Icon type="ios-eye-outline" @click.native="handleView(img)"></Icon>
|
||||
</div>
|
||||
@@ -48,44 +82,47 @@
|
||||
</li>
|
||||
</ul>
|
||||
<Modal title="View Image" v-model="visible">
|
||||
<img :src="previewImage" v-if="visible" style="width: 100%">
|
||||
<img :src="previewImage" v-if="visible" style="width: 100%" />
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { evaluationDetail } from '@/api/member.js';
|
||||
import { evaluationDetail } from "@/api/member.js";
|
||||
export default {
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
order: {}, // 订单详情
|
||||
orderGoods: {}, // 订单商品
|
||||
visible: false, // 图片预览
|
||||
previewImage: '', // 预览图片链接
|
||||
loading: false // 加载状态
|
||||
}
|
||||
previewImage: "", // 预览图片链接
|
||||
loading: false, // 加载状态
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
getDetail () { // 获取评价详情
|
||||
evaluationDetail(this.$route.query.id).then(res => {
|
||||
if (res.success) this.orderGoods = res.result
|
||||
})
|
||||
getDetail() {
|
||||
// 获取评价详情
|
||||
evaluationDetail(this.$route.query.id).then((res) => {
|
||||
if (res.success) this.orderGoods = res.result;
|
||||
});
|
||||
},
|
||||
goGoodsDetail (skuId, goodsId) { // 跳转商品详情
|
||||
goGoodsDetail(skuId, goodsId) {
|
||||
// 跳转商品详情
|
||||
let routerUrl = this.$router.resolve({
|
||||
path: '/goodsDetail',
|
||||
query: {skuId, goodsId}
|
||||
})
|
||||
window.open(routerUrl.href, '_blank')
|
||||
path: "/goodsDetail",
|
||||
query: { skuId, goodsId },
|
||||
});
|
||||
window.open(routerUrl.href, "_blank");
|
||||
},
|
||||
handleView (name) { // 预览图片
|
||||
handleView(name) {
|
||||
// 预览图片
|
||||
this.previewImage = name;
|
||||
this.visible = true;
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
this.getDetail()
|
||||
}
|
||||
}
|
||||
mounted() {
|
||||
this.getDetail();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.delivery-rate {
|
||||
@@ -94,12 +131,12 @@ export default {
|
||||
margin-top: 20px;
|
||||
height: 50px;
|
||||
border-bottom: 1px solid #eee;
|
||||
>div:nth-child(1) {
|
||||
> div:nth-child(1) {
|
||||
width: 120px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.goods-eval li{
|
||||
.goods-eval li {
|
||||
display: flex;
|
||||
border-bottom: 1px solid #eee;
|
||||
|
||||
@@ -109,7 +146,9 @@ export default {
|
||||
text-align: center;
|
||||
p {
|
||||
word-wrap: wrap;
|
||||
&:hover{ color: $theme_color; }
|
||||
&:hover {
|
||||
color: $theme_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.eval-con {
|
||||
@@ -118,7 +157,7 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.demo-upload-list{
|
||||
.demo-upload-list {
|
||||
display: inline-block;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
@@ -129,27 +168,27 @@ export default {
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
box-shadow: 0 1px 1px rgba(0,0,0,.2);
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
|
||||
margin-right: 4px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.demo-upload-list img{
|
||||
.demo-upload-list img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.demo-upload-list-cover{
|
||||
.demo-upload-list-cover {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background: rgba(0,0,0,.6);
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
.demo-upload-list:hover .demo-upload-list-cover{
|
||||
.demo-upload-list:hover .demo-upload-list-cover {
|
||||
display: block;
|
||||
}
|
||||
.demo-upload-list-cover i{
|
||||
.demo-upload-list-cover i {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
@@ -157,14 +196,14 @@ export default {
|
||||
}
|
||||
.icon-upload {
|
||||
width: 58px;
|
||||
height:58px;
|
||||
height: 58px;
|
||||
line-height: 58px;
|
||||
text-align:center;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
border:1px dashed #999;
|
||||
border: 1px dashed #999;
|
||||
border-radius: 4px;
|
||||
margin-top: 10px;
|
||||
&:hover{
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
border-color: $theme_color;
|
||||
}
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<Card class="mb_10" v-if="(afterSale.serviceStatus == 'PASS' &&
|
||||
afterSale.serviceType != 'RETURN_MONEY') || (afterSale.afterSaleAllowOperationVO && afterSale.afterSaleAllowOperationVO.cancel)">
|
||||
<Button type="success" @click="openModal" v-if="afterSale.serviceStatus == 'PASS' &&
|
||||
afterSale.serviceType != 'RETURN_MONEY'" size="small">提交物流</Button>
|
||||
afterSale.serviceType != 'RETURN_MONEY'" size="small">提交物流</Button>
|
||||
<Button type="error" @click="cancel(afterSale.sn)" v-if="afterSale.afterSaleAllowOperationVO && afterSale.afterSaleAllowOperationVO.cancel" size="small">取消售后</Button>
|
||||
</Card>
|
||||
<div class="order-card">
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
</div>
|
||||
</template>
|
||||
<template slot-scope="{ row }" slot="goodsPrice">
|
||||
<div>{{row.goodsPrice | unitPrice('¥')}}</div>
|
||||
<div>{{row.applyRefundPrice | unitPrice('¥')}}</div>
|
||||
</template>
|
||||
</Table>
|
||||
<div>
|
||||
@@ -165,6 +165,7 @@ export default {
|
||||
let params = Object.assign(this.info, this.form)
|
||||
params.images = this.uploadList.toString()
|
||||
params.orderItemSn = this.$route.query.sn
|
||||
params.reason = this.reasonList.find(item => item.id == params.reason).reason
|
||||
applyAfterSale(params).then(res => {
|
||||
if (res.success) {
|
||||
this.$Message.success('售后申请提交成功,请到售后订单查看!')
|
||||
|
||||
@@ -32,7 +32,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<Button @click="delOrder(order.sn)" class="del-btn mr_10 fontsize_16" style="margin-top:-5px;" type="text" icon="ios-trash-outline" size="small"></Button>
|
||||
<Button v-if="order.orderStatus === 'COMPLETED'" @click="delOrder(order.sn)" class="del-btn mr_10 fontsize_16" style="margin-top:-5px;" type="text" icon="ios-trash-outline" size="small"></Button>
|
||||
<span>{{ order.flowPrice | unitPrice("¥") }}</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -55,7 +55,7 @@
|
||||
>{{ goods.goodsPrice | unitPrice("¥") }} </span
|
||||
>x {{ goods.num }}
|
||||
</div>
|
||||
<Button v-if="goods.commentStatus == 'UNFINISHED'" @click="comment(order.sn, goodsIndex)" size="small" type="success" class="fontsize_12" style="position:relative;top:-22px;left:100px">评价</Button>
|
||||
<Button v-if="goods.commentStatus == 'UNFINISHED'" @click="comment(order.sn, goodsIndex)" size="small" type="success" class="fontsize_12" style="position:relative;top:-22px;left:100px;margin-right:10px">评价</Button>
|
||||
<Button v-if="goods.complainStatus == 'NO_APPLY'" @click="complain(order.sn, goodsIndex)" type="warning" class="fontsize_12" size="small" style="position:relative;top:-22px;left:100px">投诉</Button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -70,7 +70,7 @@
|
||||
<Button @click="goPay(order.sn)" size="small" type="success" v-if="order.allowOperationVO.pay">去支付</Button>
|
||||
<Button @click="received(order.sn)" size="small" type="warning" v-if="order.allowOperationVO.rog">确认收货</Button>
|
||||
<!-- 售后 -->
|
||||
<Button v-if="order.groupAfterSaleStatus.includes('NOT_APPLIED')" @click="applyAfterSale(order.orderItems)" size="small">申请售后</Button>
|
||||
<Button v-if="order.groupAfterSaleStatus && order.groupAfterSaleStatus.includes('NOT_APPLIED')" @click="applyAfterSale(order.orderItems)" size="small">申请售后</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -287,7 +287,7 @@ export default {
|
||||
},
|
||||
filterOrderStatus (status) { // 获取订单状态中文
|
||||
const ob = this.orderStatusList.filter(e => { return e.status === status });
|
||||
return ob[0].name
|
||||
return ob && ob[0] ? ob[0].name : status
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -1,17 +1,50 @@
|
||||
<template>
|
||||
<div class="order-detail" v-if="order.order">
|
||||
<card _Title="订单详情" :_Size="16"></card>
|
||||
<Card class="mb_10" v-if="order.allowOperationVO.pay || order.allowOperationVO.rog || order.allowOperationVO.cancel">
|
||||
<Button type="success" @click="goPay(order.order.sn)" size="small" v-if="order.allowOperationVO.pay">去支付</Button>
|
||||
<Button type="info" @click="received(order.order.sn)" size="small" v-if="order.allowOperationVO.rog">确认收货</Button>
|
||||
<Button type="error" @click="handleCancelOrder(order.order.sn)" v-if="order.allowOperationVO.cancel" size="small">取消订单</Button>
|
||||
<Card
|
||||
class="mb_10"
|
||||
v-if="
|
||||
order.allowOperationVO.pay ||
|
||||
order.allowOperationVO.rog ||
|
||||
order.allowOperationVO.cancel
|
||||
"
|
||||
>
|
||||
<Button
|
||||
type="success"
|
||||
@click="goPay(order.order.sn)"
|
||||
size="small"
|
||||
v-if="order.allowOperationVO.pay"
|
||||
>去支付</Button
|
||||
>
|
||||
<Button
|
||||
type="info"
|
||||
@click="received(order.order.sn)"
|
||||
size="small"
|
||||
v-if="order.allowOperationVO.rog"
|
||||
>确认收货</Button
|
||||
>
|
||||
<Button
|
||||
type="error"
|
||||
@click="handleCancelOrder(order.order.sn)"
|
||||
v-if="order.allowOperationVO.cancel"
|
||||
size="small"
|
||||
>取消订单</Button
|
||||
>
|
||||
</Card>
|
||||
<p class="verificationCode" v-if="order.order.verificationCode">核验码:<span>{{order.order.verificationCode}}</span></p>
|
||||
<p class="verificationCode" v-if="order.order.verificationCode">
|
||||
核验码:<span>{{ order.order.verificationCode }}</span>
|
||||
</p>
|
||||
<div class="order-card">
|
||||
<p class="global_color fontsize_18">{{ order.orderStatusValue }}</p>
|
||||
<p>订单号:{{ order.order.sn }}</p>
|
||||
<div style="color:#999;" class="operation-time">操作时间:{{order.order.updateTime}}</div>
|
||||
<Steps class="progress" :current="progressList.length" direction="vertical">
|
||||
<div style="color: #999" class="operation-time">
|
||||
操作时间:{{ order.order.updateTime || order.order.createTime }}
|
||||
</div>
|
||||
<Steps
|
||||
class="progress"
|
||||
:current="progressList.length"
|
||||
direction="vertical"
|
||||
>
|
||||
<Step
|
||||
:title="progress.message"
|
||||
:content="progress.createTime"
|
||||
@@ -22,46 +55,55 @@
|
||||
</div>
|
||||
<div class="order-card">
|
||||
<h3>收货人信息</h3>
|
||||
<p>收货人:{{order.order.consigneeName}}</p>
|
||||
<p>手机号码:{{order.order.consigneeMobile | secrecyMobile}}</p>
|
||||
<p>收货地址:{{order.order.consigneeAddressPath | unitAddress}} {{order.order.consigneeDetail}}</p>
|
||||
<p>收货人:{{ order.order.consigneeName }}</p>
|
||||
<p>手机号码:{{ order.order.consigneeMobile | secrecyMobile }}</p>
|
||||
<p>
|
||||
收货地址:{{ order.order.consigneeAddressPath | unitAddress }}
|
||||
{{ order.order.consigneeDetail }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="order-card">
|
||||
<h3>付款信息</h3>
|
||||
<p>支付方式:{{order.paymentMethodValue}}</p>
|
||||
<p>付款状态:{{order.payStatusValue}}</p>
|
||||
<p>支付方式:{{ order.paymentMethodValue }}</p>
|
||||
<p>付款状态:{{ order.payStatusValue }}</p>
|
||||
</div>
|
||||
<div class="order-card" v-if="!order.order.verificationCode">
|
||||
<h3>配送信息</h3>
|
||||
<p>配送方式:{{order.deliveryMethodValue}}</p>
|
||||
<p>配送状态:{{order.deliverStatusValue}}</p>
|
||||
<p v-if="logistics">物流信息:{{logistics.shipper || '暂无物流信息'}}</p>
|
||||
<p v-if="logistics">物流单号:{{logistics.logisticCode || '暂无物流单号'}}</p>
|
||||
<p>配送方式:{{ order.deliveryMethodValue }}</p>
|
||||
<p>配送状态:{{ order.deliverStatusValue }}</p>
|
||||
<p v-if="logistics">
|
||||
物流信息:{{ logistics.shipper || "暂无物流信息" }}
|
||||
</p>
|
||||
<p v-if="logistics">
|
||||
物流单号:{{ logistics.logisticCode || "暂无物流单号" }}
|
||||
</p>
|
||||
<div class="div-express-log" v-if="logistics">
|
||||
<div class="express-log">
|
||||
<p>订单日志:</p>
|
||||
<div v-for="(item, index) in logistics.traces" :key="index">
|
||||
<span class="time">{{ item.AcceptTime }}</span>
|
||||
<span class="detail">{{ item.AcceptStation }}</span>
|
||||
</div>
|
||||
<div class="express-log">
|
||||
<p>订单日志:</p>
|
||||
<div v-for="(item, index) in logistics.traces" :key="index">
|
||||
<span class="time">{{ item.AcceptTime }}</span>
|
||||
<span class="detail">{{ item.AcceptStation }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="order-card">
|
||||
<div class="order-card" v-if="order.order.payStatus === 'PAID'">
|
||||
<h3>发票信息</h3>
|
||||
<template v-if="order.order.receipt">
|
||||
<p>发票抬头:{{order.order.receiptVO.receiptTitle}}</p>
|
||||
<p>发票内容:{{order.order.receiptVO.receiptContent}}</p>
|
||||
<p v-if="order.order.receiptVO.taxpayerId">纳税人识别号:{{order.order.receiptVO.taxpayerId}}</p>
|
||||
<template v-if="order.order.needReceipt">
|
||||
<p>发票抬头:{{ order.receipt.receiptTitle }}</p>
|
||||
<p>发票内容:{{ order.receipt.receiptContent }}</p>
|
||||
<p v-if="order.receipt.taxpayerId">
|
||||
纳税人识别号:{{ order.receipt.taxpayerId }}
|
||||
</p>
|
||||
</template>
|
||||
<div v-else style="color:#999;margin-left:5px">
|
||||
未开发票
|
||||
</div>
|
||||
<div v-else style="color: #999; margin-left: 5px">未开发票</div>
|
||||
</div>
|
||||
<!-- 订单商品 -->
|
||||
<div class="goods">
|
||||
<div class="shop-name">
|
||||
<span @click="shopPage(order.order.storeId)">{{ order.order.storeName }}</span>
|
||||
<span @click="shopPage(order.order.storeId)">{{
|
||||
order.order.storeName
|
||||
}}</span>
|
||||
</div>
|
||||
<table>
|
||||
<thead>
|
||||
@@ -77,21 +119,52 @@
|
||||
<tbody>
|
||||
<tr v-for="(goods, goodsIndex) in order.orderItems" :key="goodsIndex">
|
||||
<td>
|
||||
<img @click="goodsDetail(goods.skuId, goods.goodsId)" :src="goods.image" alt="" />
|
||||
<img
|
||||
@click="goodsDetail(goods.skuId, goods.goodsId)"
|
||||
:src="goods.image"
|
||||
alt=""
|
||||
/>
|
||||
<div>
|
||||
<p @click="goodsDetail(goods.skuId, goods.goodsId)" class="hover-color">
|
||||
<p
|
||||
@click="goodsDetail(goods.skuId, goods.goodsId)"
|
||||
class="hover-color"
|
||||
>
|
||||
{{ goods.goodsName }}
|
||||
</p>
|
||||
</div>
|
||||
</td>
|
||||
<td>{{ goods.id }}</td>
|
||||
<td>{{ goods.goodsPrice | unitPrice('¥') }}</td>
|
||||
<td>{{ goods.goodsPrice | unitPrice("¥") }}</td>
|
||||
<td>{{ goods.num }}</td>
|
||||
<td>{{ (goods.goodsPrice * goods.num) | unitPrice('¥') }}</td>
|
||||
<td>{{ (goods.goodsPrice * goods.num) | unitPrice("¥") }}</td>
|
||||
<td>
|
||||
<Button v-if="goods.afterSaleStatus.includes('NOT_APPLIED') || goods.afterSaleStatus.includes('PART_AFTER_SALE')" @click="applyAfterSale(goods.sn)" type="info" size="small" class="mb_5">申请售后</Button>
|
||||
<Button v-if="goods.commentStatus == 'UNFINISHED'" @click="comment(order.order.sn, goodsIndex)" size="small" type="success" class="fontsize_12 mb_5" >评价</Button>
|
||||
<Button v-if="goods.complainStatus == 'NO_APPLY'" @click="complain(order.order.sn, goodsIndex)" type="warning" class="fontsize_12" size="small">投诉</Button>
|
||||
<Button
|
||||
v-if="
|
||||
goods.afterSaleStatus.includes('NOT_APPLIED') ||
|
||||
goods.afterSaleStatus.includes('PART_AFTER_SALE')
|
||||
"
|
||||
@click="applyAfterSale(goods.sn)"
|
||||
type="info"
|
||||
size="small"
|
||||
class="mb_5"
|
||||
>申请售后</Button
|
||||
>
|
||||
<Button
|
||||
v-if="goods.commentStatus == 'UNFINISHED'"
|
||||
@click="comment(order.order.sn, goodsIndex)"
|
||||
size="small"
|
||||
type="success"
|
||||
class="fontsize_12 mb_5"
|
||||
>评价</Button
|
||||
>
|
||||
<Button
|
||||
v-if="goods.complainStatus == 'NO_APPLY'"
|
||||
@click="complain(order.order.sn, goodsIndex)"
|
||||
type="warning"
|
||||
class="fontsize_12"
|
||||
size="small"
|
||||
>投诉</Button
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
@@ -102,127 +175,179 @@
|
||||
<span>商品件数:</span><span>{{ order.order.goodsNum }}件</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>商品总价:</span><span>{{ order.order.goodsPrice | unitPrice("¥") }}</span><br>
|
||||
<span>商品总价:</span
|
||||
><span>{{ order.order.goodsPrice | unitPrice("¥") }}</span
|
||||
><br />
|
||||
</div>
|
||||
<div>
|
||||
<span>运费:</span><span>+{{ order.order.freightPrice | unitPrice("¥") }}</span><br>
|
||||
<span>运费:</span
|
||||
><span>+{{ order.order.freightPrice | unitPrice("¥") }}</span
|
||||
><br />
|
||||
</div>
|
||||
<div v-if="order.order.priceDetailDTO.couponPrice">
|
||||
<span>优惠券:</span
|
||||
><span
|
||||
>-{{
|
||||
order.order.priceDetailDTO.couponPrice || 0 | unitPrice("¥")
|
||||
}}</span
|
||||
>
|
||||
</div>
|
||||
<div v-if="order.order.discountPrice">
|
||||
<span>活动优惠:</span
|
||||
><span>-{{ order.order.discountPrice | unitPrice("¥") }}</span>
|
||||
</div>
|
||||
<div v-if="order.order.priceDetailDTO.couponPrice"><span>优惠券:</span><span>-{{ order.order.priceDetailDTO.couponPrice || 0 | unitPrice("¥") }}</span></div>
|
||||
<div v-if="order.order.discountPrice"><span>活动优惠:</span><span>-{{ order.order.discountPrice | unitPrice("¥") }}</span></div>
|
||||
<div>
|
||||
<span>应付金额:</span>
|
||||
<span class="actrual-price">{{ order.order.flowPrice | unitPrice("¥") }}</span>
|
||||
<span class="actrual-price">{{
|
||||
order.order.flowPrice | unitPrice("¥")
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Modal v-model="cancelAvail" title="请选择取消订单原因" @on-ok="sureCancel" @on-cancel="cancelAvail = false">
|
||||
<RadioGroup v-model="cancelParams.reason" vertical type="button" button-style="solid">
|
||||
<Modal
|
||||
v-model="cancelAvail"
|
||||
title="请选择取消订单原因"
|
||||
@on-ok="sureCancel"
|
||||
@on-cancel="cancelAvail = false"
|
||||
>
|
||||
<RadioGroup
|
||||
v-model="cancelParams.reason"
|
||||
vertical
|
||||
type="button"
|
||||
button-style="solid"
|
||||
>
|
||||
<Radio :label="item.reason" v-for="item in cancelReason" :key="item.id">
|
||||
{{item.reason}}
|
||||
{{ item.reason }}
|
||||
</Radio>
|
||||
</RadioGroup>
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { orderDetail, getTraces, sureReceived, cancelOrder } from '@/api/order.js';
|
||||
import { afterSaleReason } from '@/api/member';
|
||||
import {
|
||||
orderDetail,
|
||||
getTraces,
|
||||
sureReceived,
|
||||
cancelOrder,
|
||||
} from "@/api/order.js";
|
||||
import { afterSaleReason } from "@/api/member";
|
||||
export default {
|
||||
name: 'order-detail',
|
||||
data () {
|
||||
name: "order-detail",
|
||||
data() {
|
||||
return {
|
||||
order: {}, // 订单详情数据
|
||||
progressList: [], // 订单流程
|
||||
logistics: "", // 物流数据
|
||||
cancelParams: { // 取消售后参数
|
||||
orderSn: '',
|
||||
reason: ''
|
||||
cancelParams: {
|
||||
// 取消售后参数
|
||||
orderSn: "",
|
||||
reason: "",
|
||||
},
|
||||
cancelAvail: false, // 取消订单modal控制
|
||||
cancelReason: [] // 取消订单原因
|
||||
cancelReason: [], // 取消订单原因
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
goodsDetail (skuId, goodsId) {
|
||||
goodsDetail(skuId, goodsId) {
|
||||
// 跳转商品详情
|
||||
let routeUrl = this.$router.resolve({
|
||||
path: '/goodsDetail',
|
||||
query: { skuId, goodsId }
|
||||
path: "/goodsDetail",
|
||||
query: { skuId, goodsId },
|
||||
});
|
||||
window.open(routeUrl.href, '_blank');
|
||||
window.open(routeUrl.href, "_blank");
|
||||
},
|
||||
// 跳转店铺首页
|
||||
shopPage (id) {
|
||||
shopPage(id) {
|
||||
let routeUrl = this.$router.resolve({
|
||||
path: '/Merchant',
|
||||
query: { id: id }
|
||||
path: "/Merchant",
|
||||
query: { id: id },
|
||||
});
|
||||
window.open(routeUrl.href, '_blank');
|
||||
window.open(routeUrl.href, "_blank");
|
||||
},
|
||||
getDetail () { // 获取订单详情
|
||||
orderDetail(this.$route.query.sn).then(res => {
|
||||
getDetail() {
|
||||
// 获取订单详情
|
||||
orderDetail(this.$route.query.sn).then((res) => {
|
||||
if (res.success) {
|
||||
this.order = res.result;
|
||||
this.progressList = res.result.orderLogs
|
||||
this.progressList = res.result.orderLogs;
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
traces () { // 物流信息
|
||||
getTraces(this.$route.query.sn).then(res => {
|
||||
traces() {
|
||||
// 物流信息
|
||||
getTraces(this.$route.query.sn).then((res) => {
|
||||
if (res.success) {
|
||||
this.logistics = res.result
|
||||
this.logistics = res.result;
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
received (sn) { // 确认收货
|
||||
sureReceived(sn).then(res => {
|
||||
received(sn) {
|
||||
// 确认收货
|
||||
sureReceived(sn).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success('确认收货成功')
|
||||
this.getDetail()
|
||||
this.$Message.success("确认收货成功");
|
||||
this.getDetail();
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
goPay (sn) { // 去支付
|
||||
this.$router.push({path: '/payment', query: {orderType: 'ORDER', sn}});
|
||||
goPay(sn) {
|
||||
// 去支付
|
||||
this.$router.push({
|
||||
path: "/payment",
|
||||
query: { orderType: "ORDER", sn },
|
||||
});
|
||||
},
|
||||
applyAfterSale (sn) { // 申请售后
|
||||
this.$router.push({name: 'ApplyAfterSale', query: {sn: sn}})
|
||||
applyAfterSale(sn) {
|
||||
// 申请售后
|
||||
this.$router.push({ name: "ApplyAfterSale", query: { sn: sn } });
|
||||
},
|
||||
comment (sn, goodsIndex) { // 评价
|
||||
this.$router.push({path: '/home/addEval', query: {sn, index: goodsIndex}})
|
||||
comment(sn, goodsIndex) {
|
||||
// 评价
|
||||
this.$router.push({
|
||||
path: "/home/addEval",
|
||||
query: { sn, index: goodsIndex },
|
||||
});
|
||||
},
|
||||
complain (sn, goodsIndex) { // 投诉
|
||||
this.$router.push({name: 'Complain', query: {sn, index: goodsIndex}})
|
||||
complain(sn, goodsIndex) {
|
||||
// 投诉
|
||||
this.$router.push({ name: "Complain", query: { sn, index: goodsIndex } });
|
||||
},
|
||||
handleCancelOrder (sn) {
|
||||
handleCancelOrder(sn) {
|
||||
// 取消订单
|
||||
this.cancelParams.orderSn = sn;
|
||||
afterSaleReason('CANCEL').then(res => {
|
||||
afterSaleReason("CANCEL").then((res) => {
|
||||
if (res.success) {
|
||||
this.cancelReason = res.result;
|
||||
this.cancelAvail = true
|
||||
this.cancelParams.reason = this.cancelReason[0].reason
|
||||
this.cancelAvail = true;
|
||||
this.cancelParams.reason = this.cancelReason[0].reason;
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
sureCancel () { // 确定取消
|
||||
cancelOrder(this.cancelParams).then(res => {
|
||||
sureCancel() {
|
||||
// 确定取消
|
||||
cancelOrder(this.cancelParams).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success('取消订单成功')
|
||||
this.getDetail()
|
||||
this.cancelAvail = false
|
||||
this.$Message.success("取消订单成功");
|
||||
this.getDetail();
|
||||
this.cancelAvail = false;
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getDetail();
|
||||
this.traces();
|
||||
},
|
||||
mounted () {
|
||||
this.getDetail()
|
||||
this.traces()
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.mb_5{
|
||||
.mb_10 {
|
||||
Button:nth-of-type(2) {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.mb_5 {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.order-card {
|
||||
@@ -323,7 +448,7 @@ table {
|
||||
color: rgb(65, 63, 63);
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
span{
|
||||
span {
|
||||
color: $theme_color;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -72,7 +72,7 @@ export default {
|
||||
go (item) { // 根据使用条件跳转商品列表页面
|
||||
if (this.params.memberCouponStatus !== 'NEW') return;
|
||||
|
||||
if (item.storeId !== 'platform') {
|
||||
if (item.storeId !== '0') {
|
||||
this.$router.push({path: '/merchant', query: {id: item.storeId}})
|
||||
} else {
|
||||
if (item.scopeType === 'PORTION_GOODS_CATEGORY') {
|
||||
|
||||
@@ -1,15 +1,19 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<!-- 卡片组件 -->
|
||||
<card _Title="我的足迹" :_Size="16" ></card>
|
||||
<card _Title="我的足迹" :_Size="16"></card>
|
||||
<Button class="del-btn" @click="clearAll" type="primary">删除全部</Button>
|
||||
<!-- 订单列表 -->
|
||||
<empty v-if="list.length === 0" />
|
||||
<ul class="track-list" v-else>
|
||||
<li v-for="(item, index) in list" :key="index" @click="goodsDetail(item.id, item.goodsId)">
|
||||
<img :src="item.thumbnail" :alt="item.thumbnail" width="200" height="200">
|
||||
<p class="ellipsis">{{item.goodsName}}</p>
|
||||
<p>{{item.price | unitPrice('¥')}}</p>
|
||||
<li
|
||||
v-for="(item, index) in list"
|
||||
:key="index"
|
||||
@click="goodsDetail(item.id, item.goodsId)"
|
||||
>
|
||||
<img :src="item.thumbnail" :alt="item.thumbnail" width="200" height="200" />
|
||||
<p class="ellipsis">{{ item.goodsName }}</p>
|
||||
<p>{{ item.price | unitPrice("¥") }}</p>
|
||||
<span class="del-icon" @click.stop="clearById(item.goodsId)">
|
||||
<Icon type="md-trash" />
|
||||
</span>
|
||||
@@ -17,96 +21,104 @@
|
||||
</ul>
|
||||
<!-- 分页 -->
|
||||
<div class="page-size">
|
||||
<Page :total="total" @on-change="changePageNum"
|
||||
<Page
|
||||
:total="total"
|
||||
@on-change="changePageNum"
|
||||
@on-page-size-change="changePageSize"
|
||||
:page-size="params.pageSize"
|
||||
show-sizer>
|
||||
show-sizer
|
||||
>
|
||||
</Page>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tracksList, clearTracks, clearTracksById } from '@/api/member';
|
||||
import { tracksList, clearTracks, clearTracksById } from "@/api/member";
|
||||
export default {
|
||||
name: 'MyTrack',
|
||||
data () {
|
||||
name: "MyTrack",
|
||||
data() {
|
||||
return {
|
||||
list: [], // 我的足迹,商品列表
|
||||
spinShow: false, // 控制loading是否加载
|
||||
params: {
|
||||
pageNumber: 1,
|
||||
pageSize: 30,
|
||||
order: 'desc',
|
||||
sort: 'createTime'
|
||||
order: "desc",
|
||||
sort: "updateTime",
|
||||
},
|
||||
total: 0
|
||||
total: 0,
|
||||
};
|
||||
},
|
||||
mounted () {
|
||||
mounted() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
goodsDetail (skuId, goodsId) {
|
||||
goodsDetail(skuId, goodsId) {
|
||||
// 跳转商品详情
|
||||
let routeUrl = this.$router.resolve({
|
||||
path: '/goodsDetail',
|
||||
query: { skuId, goodsId }
|
||||
path: "/goodsDetail",
|
||||
query: { skuId, goodsId },
|
||||
});
|
||||
window.open(routeUrl.href, '_blank');
|
||||
window.open(routeUrl.href, "_blank");
|
||||
},
|
||||
// 跳转店铺首页
|
||||
shopPage (id) {
|
||||
shopPage(id) {
|
||||
let routeUrl = this.$router.resolve({
|
||||
path: '/Merchant',
|
||||
query: { id: id }
|
||||
path: "/Merchant",
|
||||
query: { id: id },
|
||||
});
|
||||
window.open(routeUrl.href, '_blank');
|
||||
window.open(routeUrl.href, "_blank");
|
||||
},
|
||||
clearAll () { // 清除全部足迹
|
||||
clearAll() {
|
||||
// 清除全部足迹
|
||||
this.$Modal.confirm({
|
||||
title: '删除',
|
||||
content: '<p>确定要删除全部足迹吗?</p>',
|
||||
title: "删除",
|
||||
content: "<p>确定要删除全部足迹吗?</p>",
|
||||
onOk: () => {
|
||||
clearTracks().then(res => {
|
||||
clearTracks().then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success('删除成功')
|
||||
this.getList()
|
||||
this.$Message.success("删除成功");
|
||||
this.getList();
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
onCancel: () => { }
|
||||
onCancel: () => {},
|
||||
});
|
||||
},
|
||||
clearById (id) { // 清除全部足迹
|
||||
clearTracksById(id).then(res => {
|
||||
clearById(id) {
|
||||
// 清除全部足迹
|
||||
clearTracksById(id).then((res) => {
|
||||
if (res.success) {
|
||||
this.$Message.success('删除成功')
|
||||
this.getList()
|
||||
this.$Message.success("删除成功");
|
||||
this.getList();
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
changePageNum (val) { // 修改页码
|
||||
changePageNum(val) {
|
||||
// 修改页码
|
||||
this.params.pageNumber = val;
|
||||
this.getList()
|
||||
this.getList();
|
||||
},
|
||||
changePageSize (val) { // 修改页数
|
||||
changePageSize(val) {
|
||||
// 修改页数
|
||||
this.params.pageNumber = 1;
|
||||
this.params.pageSize = val;
|
||||
this.getList()
|
||||
this.getList();
|
||||
},
|
||||
getList () { // 获取足迹列表
|
||||
getList() {
|
||||
// 获取足迹列表
|
||||
this.spinShow = true;
|
||||
tracksList(this.params).then(res => {
|
||||
this.spinShow = false
|
||||
if (res.success && res.result) {
|
||||
this.list = res.result;
|
||||
tracksList(this.params).then((res) => {
|
||||
this.spinShow = false;
|
||||
if (res.success && res.result.records.length) {
|
||||
this.list = res.result.records;
|
||||
} else {
|
||||
this.list = []
|
||||
this.list = [];
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
@@ -120,34 +132,34 @@ export default {
|
||||
.track-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
li{
|
||||
li {
|
||||
width: 200px;
|
||||
overflow: hidden;
|
||||
margin-left: 15px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid #eee;
|
||||
position: relative;
|
||||
&:hover{
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
box-shadow:1px 1px 3px #999;
|
||||
.del-icon{
|
||||
box-shadow: 1px 1px 3px #999;
|
||||
.del-icon {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
p{
|
||||
p {
|
||||
padding: 0 5px;
|
||||
margin: 3px 0;
|
||||
}
|
||||
p:nth-child(2) {
|
||||
color: #999;
|
||||
}
|
||||
p:nth-child(3){
|
||||
p:nth-child(3) {
|
||||
color: $theme_color;
|
||||
}
|
||||
.del-icon {
|
||||
display: none;
|
||||
font-size: 30px;
|
||||
background-color:rgba(0,0,0,.3);
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
position: absolute;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
|
||||
@@ -43,13 +43,20 @@
|
||||
<div>
|
||||
<span>{{ item.name }}</span>
|
||||
<Tag class="ml_10" v-if="item.isDefault" color="red">默认</Tag>
|
||||
<Tag class="ml_10" v-if="item.alias" color="warning">{{ item.alias }} </Tag>
|
||||
<Tag class="ml_10" v-if="item.alias" color="warning"
|
||||
>{{ item.alias }}
|
||||
</Tag>
|
||||
</div>
|
||||
<div>{{ item.mobile }}</div>
|
||||
<div>{{ item.consigneeAddressPath | unitAddress }} {{ item.detail }}</div>
|
||||
<div>
|
||||
{{ item.consigneeAddressPath | unitAddress }} {{ item.detail }}
|
||||
</div>
|
||||
<div class="edit-btn" v-show="showEditBtn === index">
|
||||
<span @click.stop="editAddress(item.id)">修改</span>
|
||||
<span class="ml_10" v-if="!item.isDefault" @click.stop="delAddress(item)"
|
||||
<span
|
||||
class="ml_10"
|
||||
v-if="!item.isDefault"
|
||||
@click.stop="delAddress(item)"
|
||||
>删除</span
|
||||
>
|
||||
</div>
|
||||
@@ -80,45 +87,59 @@
|
||||
<span>商品信息</span>
|
||||
<span @click="$router.push('/cart')">返回购物车</span>
|
||||
</div>
|
||||
<div class="goods-msg" v-for="(shop, shopIndex) in goodsList" :key="shopIndex">
|
||||
<div class="shop-name">
|
||||
<span>
|
||||
<span class="hover-color" @click="goShopPage(shop.storeId)">{{
|
||||
shop.storeName
|
||||
}}</span
|
||||
>
|
||||
</span>
|
||||
</div>
|
||||
<div class="goods-list">
|
||||
<div
|
||||
class="goods-item"
|
||||
v-for="(goods, goodsIndex) in shop.skuList"
|
||||
:key="goodsIndex"
|
||||
>
|
||||
<span
|
||||
class="hover-color"
|
||||
@click="goGoodsDetail(goods.goodsSku.id, goods.goodsSku.goodsId)"
|
||||
>
|
||||
<img :src="goods.goodsSku.thumbnail" alt="" />
|
||||
<span style="vertical-align: top">{{ goods.goodsSku.goodsName }}</span>
|
||||
<div
|
||||
class="goods-msg"
|
||||
v-for="(shop, shopIndex) in goodsList"
|
||||
:key="shopIndex"
|
||||
>
|
||||
<div v-if="shop.checked">
|
||||
<div class="shop-name">
|
||||
<span>
|
||||
<span class="hover-color" @click="goShopPage(shop.storeId)">{{
|
||||
shop.storeName
|
||||
}}</span
|
||||
>
|
||||
</span>
|
||||
<span class="goods-price">{{ goods.purchasePrice | unitPrice("¥") }}</span>
|
||||
<span>x{{ goods.num }}</span>
|
||||
<span>{{ goods.goodsSku.quantity > 0 ? "有货" : "无货" }}</span>
|
||||
<span class="goods-price">{{ goods.subTotal | unitPrice("¥") }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="order-mark">
|
||||
<Input
|
||||
type="textarea"
|
||||
maxlength="60"
|
||||
v-model="shop.remark"
|
||||
show-word-limit
|
||||
placeholder="订单备注"
|
||||
/>
|
||||
<span style="font-size: 12px; color: #999"
|
||||
>提示:请勿填写有关支付、收货、发票方面的信息</span
|
||||
>
|
||||
<div class="goods-list">
|
||||
<div
|
||||
class="goods-item"
|
||||
v-for="(goods, goodsIndex) in shop.checkedSkuList"
|
||||
:key="goodsIndex"
|
||||
>
|
||||
<span
|
||||
class="hover-color"
|
||||
@click="
|
||||
goGoodsDetail(goods.goodsSku.id, goods.goodsSku.goodsId)
|
||||
"
|
||||
>
|
||||
<img :src="goods.goodsSku.thumbnail" alt="" />
|
||||
<span style="vertical-align: top">{{
|
||||
goods.goodsSku.goodsName
|
||||
}}</span>
|
||||
</span>
|
||||
<span class="goods-price">{{
|
||||
goods.purchasePrice | unitPrice("¥")
|
||||
}}</span>
|
||||
<span>x{{ goods.num }}</span>
|
||||
<span>{{ goods.goodsSku.quantity > 0 ? "有货" : "无货" }}</span>
|
||||
<span class="goods-price">{{
|
||||
goods.subTotal | unitPrice("¥")
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="order-mark">
|
||||
<Input
|
||||
type="textarea"
|
||||
maxlength="60"
|
||||
v-model="shop.remark"
|
||||
show-word-limit
|
||||
placeholder="订单备注"
|
||||
/>
|
||||
<span style="font-size: 12px; color: #999"
|
||||
>提示:请勿填写有关支付、收货、发票方面的信息</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -146,11 +167,19 @@
|
||||
</div>
|
||||
<div v-if="couponList.length === 0">无可用优惠券</div>
|
||||
<ul v-else class="coupon-list">
|
||||
<li v-for="(item, index) in couponList" class="coupon-item" :key="index">
|
||||
<li
|
||||
v-for="(item, index) in couponList"
|
||||
class="coupon-item"
|
||||
:key="index"
|
||||
>
|
||||
<div class="c-left">
|
||||
<div>
|
||||
<span v-if="item.couponType === 'PRICE'" class="fontsize_12 global_color"
|
||||
>¥<span class="price">{{ item.price | unitPrice }}</span></span
|
||||
<span
|
||||
v-if="item.couponType === 'PRICE'"
|
||||
class="fontsize_12 global_color"
|
||||
>¥<span class="price">{{
|
||||
item.price | unitPrice
|
||||
}}</span></span
|
||||
>
|
||||
<span
|
||||
v-if="item.couponType === 'DISCOUNT'"
|
||||
@@ -158,7 +187,9 @@
|
||||
><span class="price">{{ item.discount }}</span
|
||||
>折</span
|
||||
>
|
||||
<span class="describe">满{{ item.consumeThreshold }}元可用</span>
|
||||
<span class="describe"
|
||||
>满{{ item.consumeThreshold }}元可用</span
|
||||
>
|
||||
</div>
|
||||
<p>使用范围:{{ useScope(item.scopeType) }}</p>
|
||||
<p>有效期:{{ item.endTime }}</p>
|
||||
@@ -225,9 +256,17 @@
|
||||
</div>
|
||||
<BaseFooter></BaseFooter>
|
||||
<!-- 添加发票模态框 -->
|
||||
<invoice-modal ref="invModal" :invoiceData="invoiceData" @change="getInvMsg" />
|
||||
<invoice-modal
|
||||
ref="invModal"
|
||||
:invoiceData="invoiceData"
|
||||
@change="getInvMsg"
|
||||
/>
|
||||
<!-- 选择地址模态框 -->
|
||||
<address-manage ref="address" :id="addrId" @change="addrChange"></address-manage>
|
||||
<address-manage
|
||||
ref="address"
|
||||
:id="addrId"
|
||||
@change="addrChange"
|
||||
></address-manage>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -303,6 +342,25 @@ export default {
|
||||
.then((res) => {
|
||||
this.$Spin.hide();
|
||||
if (res.success) {
|
||||
if (
|
||||
!res.result.checkedSkuList ||
|
||||
res.result.checkedSkuList.length === 0
|
||||
) {
|
||||
if (res.result.skuList && res.result.skuList[0]) {
|
||||
this.$Modal.warning({
|
||||
title: "购物车存在无效商品!",
|
||||
content:
|
||||
"[" +
|
||||
res.result.skuList[0].goodsSku.goodsName +
|
||||
"]" +
|
||||
res.result.skuList[0].errorMessage,
|
||||
});
|
||||
}
|
||||
this.$router.push({
|
||||
path: "/cart",
|
||||
replace: true,
|
||||
});
|
||||
}
|
||||
this.goodsList = res.result.cartList;
|
||||
this.priceDetailDTO = res.result.priceDetailDTO;
|
||||
this.skuList = res.result.skuList;
|
||||
@@ -313,11 +371,19 @@ export default {
|
||||
let notSupArea = res.result.notSupportFreight;
|
||||
this.selectedCoupon = {};
|
||||
if (res.result.platformCoupon)
|
||||
this.selectedCoupon[res.result.platformCoupon.memberCoupon.id] = res.result.platformCoupon;
|
||||
if (res.result.storeCoupons && Object.keys(res.result.storeCoupons)[0]) {
|
||||
let storeMemberCouponsId = Object.keys(res.result.storeCoupons)[0];
|
||||
let storeCouponId = res.result.storeCoupons[storeMemberCouponsId].memberCoupon.id;
|
||||
this.selectedCoupon[storeCouponId] = res.result.storeCoupons[storeMemberCouponsId];
|
||||
this.selectedCoupon[res.result.platformCoupon.memberCoupon.id] =
|
||||
res.result.platformCoupon;
|
||||
if (
|
||||
res.result.storeCoupons &&
|
||||
Object.keys(res.result.storeCoupons)[0]
|
||||
) {
|
||||
let storeMemberCouponsId = Object.keys(
|
||||
res.result.storeCoupons
|
||||
)[0];
|
||||
let storeCouponId =
|
||||
res.result.storeCoupons[storeMemberCouponsId].memberCoupon.id;
|
||||
this.selectedCoupon[storeCouponId] =
|
||||
res.result.storeCoupons[storeMemberCouponsId];
|
||||
}
|
||||
if (notSupArea) {
|
||||
let content = [];
|
||||
@@ -344,7 +410,10 @@ export default {
|
||||
const couponKeys = Object.keys(this.selectedCoupon);
|
||||
if (couponKeys.length) {
|
||||
this.couponList.forEach((e) => {
|
||||
if (this.selectedCoupon[e.id] && e.id === this.selectedCoupon[e.id].memberCoupon.id) {
|
||||
if (
|
||||
this.selectedCoupon[e.id] &&
|
||||
e.id === this.selectedCoupon[e.id].memberCoupon.id
|
||||
) {
|
||||
this.usedCouponId.push(e.id);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -6,14 +6,23 @@
|
||||
<div class="promotion-decorate">限时秒杀</div>
|
||||
<ul class="time-line">
|
||||
<template v-for="(time, index) in list">
|
||||
<li v-if="index < 5" @click="currIndex = index" :key="index" :class="{'currTimeline': currIndex === index}">
|
||||
<div>{{time.timeLine+':00'}}</div>
|
||||
<li
|
||||
v-if="index < 5"
|
||||
@click="currIndex = index"
|
||||
:key="index"
|
||||
:class="{ currTimeline: currIndex === index }"
|
||||
>
|
||||
<div>{{ time.timeLine + ":00" }}</div>
|
||||
<div v-if="currIndex === index">
|
||||
<p>{{nowHour >= time.timeLine ? '秒杀中' : '即将开始'}}</p>
|
||||
<p>{{nowHour >= time.timeLine ? '距结束' : '距开始'}} {{currTime}}</p>
|
||||
<p>{{ nowHour >= time.timeLine ? "秒杀中" : "即将开始" }}</p>
|
||||
<p>
|
||||
{{ nowHour >= time.timeLine ? "距结束" : "距开始" }} {{
|
||||
currTime
|
||||
}}
|
||||
</p>
|
||||
</div>
|
||||
<div v-else class="not-curr">
|
||||
{{nowHour >= time.timeLine ? '秒杀中' : '即将开始'}}
|
||||
{{ nowHour >= time.timeLine ? "秒杀中" : "即将开始" }}
|
||||
</div>
|
||||
</li>
|
||||
</template>
|
||||
@@ -23,28 +32,63 @@
|
||||
<empty v-if="goodsList.length === 0" />
|
||||
<div
|
||||
v-else
|
||||
class="goods-show-info"
|
||||
class="goods-show-info1"
|
||||
v-for="(item, index) in goodsList"
|
||||
:key="index"
|
||||
@click="goGoodsDetail(item.skuId, item.goodsId)"
|
||||
>
|
||||
<div class="goods-show-img">
|
||||
<img width="220" height="220" :src="item.goodsImage" />
|
||||
<img width="200" height="200" :src="item.goodsImage" />
|
||||
</div>
|
||||
<div class="goods-show-price">
|
||||
<span>
|
||||
<span class="seckill-price text-danger">{{
|
||||
item.price | unitPrice("¥")
|
||||
}}</span>
|
||||
<span style="color:#999;text-decoration:line-through;">{{item.originalPrice | unitPrice('¥')}}</span>
|
||||
<span style="color: #999; text-decoration: line-through">{{
|
||||
item.originalPrice | unitPrice("¥")
|
||||
}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="goods-show-detail">
|
||||
<span>{{ item.goodsName }}</span>
|
||||
</div>
|
||||
<div class="goods-seckill-btn" :class="{'goods-seckill-btn-gray' : nowHour < list[currIndex].timeLine}">{{nowHour >= list[currIndex].timeLine ? '立即抢购' : '即将开始'}}</div>
|
||||
<div class="goods-show-num">
|
||||
已售<Progress style="width:110px" class="ml_10" :percent="Math.floor(item.salesNum/item.quantity)" />
|
||||
<div
|
||||
class="goods-seckill-btn"
|
||||
:class="{
|
||||
'goods-seckill-btn-gray': nowHour < list[currIndex].timeLine,
|
||||
}"
|
||||
>
|
||||
{{ nowHour >= list[currIndex].timeLine ? "立即抢购" : "即将开始" }}
|
||||
</div>
|
||||
<div
|
||||
v-if="nowHour >= list[currIndex].timeLine"
|
||||
class="goods-seckill-btn goods-seckill-btn-gray"
|
||||
>
|
||||
已售罄
|
||||
</div>
|
||||
<div v-if="nowHour >= list[currIndex].timeLine" class="goods-show-num1">
|
||||
<span
|
||||
>已售{{
|
||||
(item.quantity && item.quantity > 0
|
||||
? Math.ceil(
|
||||
(item.salesNum / (item.quantity + item.salesNum)) * 100
|
||||
)
|
||||
: 100) + "%"
|
||||
}}</span
|
||||
><Progress
|
||||
hide-info
|
||||
stroke-color="#df0021"
|
||||
style="width: 110px"
|
||||
class="ml_10"
|
||||
:percent="
|
||||
item.quantity && item.quantity > 0
|
||||
? Math.ceil(
|
||||
(item.salesNum / (item.quantity + item.salesNum)) * 100
|
||||
)
|
||||
: 100
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
<div class="goods-show-seller">
|
||||
<span>{{ item.storeName }}</span>
|
||||
@@ -55,9 +99,9 @@
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {seckillByDay} from '@/api/promotion'
|
||||
import { seckillByDay } from "@/api/promotion";
|
||||
export default {
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
list: [], // 秒杀时段列表
|
||||
goodsList: [], // 商品列表
|
||||
@@ -65,22 +109,22 @@ export default {
|
||||
currIndex: 0, // 当前时间段的下标
|
||||
currTime: 0, // 当前显示的倒计时
|
||||
diffSeconds: 0, // 倒计时时间戳
|
||||
nowHour: new Date().getHours() // 当前小时数
|
||||
}
|
||||
nowHour: new Date().getHours(), // 当前小时数
|
||||
};
|
||||
},
|
||||
beforeDestroy () {
|
||||
beforeDestroy() {
|
||||
// 销毁前清除定时器
|
||||
clearInterval(this.interval);
|
||||
},
|
||||
watch: {
|
||||
currIndex (val) {
|
||||
clearInterval(this.interval)
|
||||
this.interval = null
|
||||
this.nowHour = new Date().getHours()
|
||||
this.countDown(val)
|
||||
this.goodsList = this.list[val].seckillGoodsList
|
||||
currIndex(val) {
|
||||
clearInterval(this.interval);
|
||||
this.interval = null;
|
||||
this.nowHour = new Date().getHours();
|
||||
this.countDown(val);
|
||||
this.goodsList = this.list[val].seckillGoodsList;
|
||||
},
|
||||
diffSeconds (val) {
|
||||
diffSeconds(val) {
|
||||
const hours = Math.floor(val / 3600);
|
||||
// 当前秒数 / 60,向下取整
|
||||
// 获取到所有分钟数 3600 / 60 = 60分钟
|
||||
@@ -88,66 +132,72 @@ export default {
|
||||
const minutes = Math.floor(val / 60) % 60;
|
||||
// 当前的秒数 % 60,获取到 超过小时数、分钟数的秒数(秒数)
|
||||
const seconds = val % 60;
|
||||
this.currTime = filteTime(hours) + ':' + filteTime(minutes) + ':' + filteTime(seconds)
|
||||
this.currTime =
|
||||
filteTime(hours) + ":" + filteTime(minutes) + ":" + filteTime(seconds);
|
||||
if (val <= 0) {
|
||||
clearInterval(this.interval)
|
||||
this.interval = null
|
||||
clearInterval(this.interval);
|
||||
this.interval = null;
|
||||
}
|
||||
function filteTime (time) {
|
||||
function filteTime(time) {
|
||||
if (time < 10) {
|
||||
return '0' + time
|
||||
return "0" + time;
|
||||
} else {
|
||||
return time
|
||||
return time;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getListByDay () { // 当天秒杀活动
|
||||
seckillByDay().then(res => {
|
||||
getListByDay() {
|
||||
// 当天秒杀活动
|
||||
seckillByDay().then((res) => {
|
||||
if (res.success) {
|
||||
this.list = res.result
|
||||
this.goodsList = this.list[0].seckillGoodsList
|
||||
this.countDown(this.currIndex)
|
||||
this.list = res.result;
|
||||
this.goodsList = this.list[0].seckillGoodsList;
|
||||
this.countDown(this.currIndex);
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
goGoodsDetail (skuId, goodsId) {
|
||||
goGoodsDetail(skuId, goodsId) {
|
||||
// 跳转商品详情
|
||||
let routeUrl = this.$router.resolve({
|
||||
path: '/goodsDetail',
|
||||
query: { skuId, goodsId }
|
||||
path: "/goodsDetail",
|
||||
query: { skuId, goodsId },
|
||||
});
|
||||
window.open(routeUrl.href, '_blank');
|
||||
window.open(routeUrl.href, "_blank");
|
||||
},
|
||||
countDown (currIndex) { // 倒计时
|
||||
countDown(currIndex) {
|
||||
// 倒计时
|
||||
// 0点时间戳
|
||||
let zeroTime = new Date(new Date().toLocaleDateString()).getTime();
|
||||
let currTime = new Date().getTime()
|
||||
let currTime = new Date().getTime();
|
||||
let actTime = 0;
|
||||
let nowHour = new Date().getHours(); // 当前小时数
|
||||
if (this.list[currIndex].timeLine > nowHour) { // 活动未开始
|
||||
actTime = zeroTime + this.list[currIndex].timeLine * 3600 * 1000
|
||||
} else if (this.list[currIndex].timeLine <= nowHour) { // 活动进行中
|
||||
if (currIndex === this.list.length - 1) { // 如果是最后一个活动,直到24点结束
|
||||
actTime = zeroTime + 24 * 3600 * 1000
|
||||
if (this.list[currIndex].timeLine > nowHour) {
|
||||
// 活动未开始
|
||||
actTime = zeroTime + this.list[currIndex].timeLine * 3600 * 1000;
|
||||
} else if (this.list[currIndex].timeLine <= nowHour) {
|
||||
// 活动进行中
|
||||
if (currIndex === this.list.length - 1) {
|
||||
// 如果是最后一个活动,直到24点结束
|
||||
actTime = zeroTime + 24 * 3600 * 1000;
|
||||
} else {
|
||||
actTime = zeroTime + this.list[currIndex + 1].timeLine * 3600 * 1000
|
||||
actTime = zeroTime + this.list[currIndex + 1].timeLine * 3600 * 1000;
|
||||
}
|
||||
}
|
||||
this.diffSeconds = Math.floor((actTime - currTime) / 1000)
|
||||
this.diffSeconds = Math.floor((actTime - currTime) / 1000);
|
||||
this.interval = setInterval(() => {
|
||||
this.diffSeconds--
|
||||
}, 1000)
|
||||
}
|
||||
this.diffSeconds--;
|
||||
}, 1000);
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
this.getListByDay()
|
||||
}
|
||||
}
|
||||
mounted() {
|
||||
this.getListByDay();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import '../../assets/styles/goodsList.scss';
|
||||
@import "../../assets/styles/goodsList.scss";
|
||||
.goods-seckill-btn {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
@@ -163,16 +213,17 @@ export default {
|
||||
.goods-seckill-btn-gray {
|
||||
background-color: #666;
|
||||
}
|
||||
.promotion-decorate::before,.promotion-decorate::after{
|
||||
background-image: url('/src/assets/images/sprite@2x.png');
|
||||
.promotion-decorate::before,
|
||||
.promotion-decorate::after {
|
||||
background-image: url("/src/assets/images/sprite@2x.png");
|
||||
}
|
||||
.time-line{
|
||||
.time-line {
|
||||
width: 1200px;
|
||||
height: 60px;
|
||||
margin: 0 auto;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
li{
|
||||
li {
|
||||
padding: 0 30px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
@@ -180,7 +231,7 @@ export default {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
&:hover{
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
.not-curr {
|
||||
@@ -192,16 +243,37 @@ export default {
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
.currTimeline{
|
||||
.currTimeline {
|
||||
background-color: $theme_color;
|
||||
color: #fff;
|
||||
>div:nth-child(1) {
|
||||
> div:nth-child(1) {
|
||||
font-size: 20px;
|
||||
}
|
||||
>div:nth-child(2) {
|
||||
> div:nth-child(2) {
|
||||
font-size: 14px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.goods-show-info1 {
|
||||
width: 275px;
|
||||
padding: 6px;
|
||||
margin: 10px 0px;
|
||||
margin-left: 5px;
|
||||
position: relative;
|
||||
border: 1px solid #fff;
|
||||
cursor: pointer;
|
||||
background-color: #fff;
|
||||
}
|
||||
.goods-show-info1:hover {
|
||||
border: 1px solid #ccc;
|
||||
box-shadow: 0px 0px 15px #ccc;
|
||||
}
|
||||
.goods-show-img {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.ivu-progress-success .ivu-progress-bg {
|
||||
background-color: #111fff;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -15,10 +15,15 @@
|
||||
>
|
||||
<div class="user-icon">
|
||||
<div class="user-img">
|
||||
<img :src="userInfo.face" style="width:100%;height:100%;" v-if="userInfo.face" alt />
|
||||
<img
|
||||
:src="userInfo.face"
|
||||
style="width: 100%; height: 100%"
|
||||
v-if="userInfo.face"
|
||||
alt
|
||||
/>
|
||||
<Avatar icon="ios-person" class="mb_10" v-else size="96" />
|
||||
</div>
|
||||
<p>{{userInfo.nickName}}</p>
|
||||
<p>{{ userInfo.nickName }}</p>
|
||||
</div>
|
||||
|
||||
<!-- 循环导航栏 -->
|
||||
@@ -38,7 +43,6 @@
|
||||
>{{ chlidren.title }}</MenuItem
|
||||
>
|
||||
</Submenu>
|
||||
|
||||
</Menu>
|
||||
</Sider>
|
||||
<Layout class="layout ml_10">
|
||||
@@ -54,47 +58,33 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import menuList from './menu';
|
||||
import Storage from '@/plugins/storage.js';
|
||||
import menuList from "./menu";
|
||||
import Storage from "@/plugins/storage.js";
|
||||
|
||||
export default {
|
||||
name: 'Home',
|
||||
data () {
|
||||
name: "Home",
|
||||
data() {
|
||||
return {
|
||||
menuList // 会员中心左侧列表
|
||||
menuList, // 会员中心左侧列表
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
userInfo () { // 用户信息
|
||||
if(Storage.getItem('userInfo')){
|
||||
return JSON.parse(Storage.getItem('userInfo'));
|
||||
} else{
|
||||
this.$Modal.confirm({
|
||||
title:'请登录',
|
||||
content:"<p>请登录后执行此操作</p>",
|
||||
okText: '立即登录',
|
||||
cancelText: '继续浏览',
|
||||
onOk:()=>{
|
||||
if(true){
|
||||
this.$router.push('/login');
|
||||
}
|
||||
}
|
||||
})
|
||||
return {}
|
||||
}
|
||||
}
|
||||
userInfo() {
|
||||
// 用户信息
|
||||
if (Storage.getItem("userInfo")) {
|
||||
return JSON.parse(Storage.getItem("userInfo"));
|
||||
} else {
|
||||
return {};
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 每次点击左侧bar的callback
|
||||
onSelect (name) {
|
||||
this.$router.push({name: name});
|
||||
onSelect(name) {
|
||||
this.$router.push({ name: name });
|
||||
},
|
||||
// 跳转到个人中心的首页
|
||||
toUserMain () {
|
||||
this.$router.push(`/home`);
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,132 +1,200 @@
|
||||
/**
|
||||
* 一些常用的基础方法
|
||||
* unixToDate 将unix时间戳转换为指定格式
|
||||
* dateToUnix 将时间转unix时间戳
|
||||
* deepClone 对一个对象进行深拷贝
|
||||
* formatPrice 货币格式化
|
||||
* secrecyMobile 手机号隐私保护
|
||||
* randomString 随机生成指定长度的字符串
|
||||
*/
|
||||
|
||||
/**
|
||||
* 将unix时间戳转换为指定格式
|
||||
* @param unix 时间戳【秒】
|
||||
* @param format 转换格式
|
||||
* @returns {*|string}
|
||||
*/
|
||||
function unixToDate (unix, format) {
|
||||
if (!unix) return unix
|
||||
let _format = format || 'yyyy-MM-dd hh:mm:ss'
|
||||
const d = new Date(unix)
|
||||
const o = {
|
||||
'M+': d.getMonth() + 1,
|
||||
'd+': d.getDate(),
|
||||
'h+': d.getHours(),
|
||||
'm+': d.getMinutes(),
|
||||
's+': d.getSeconds(),
|
||||
'q+': Math.floor((d.getMonth() + 3) / 3),
|
||||
S: d.getMilliseconds()
|
||||
}
|
||||
if (/(y+)/.test(_format)) _format = _format.replace(RegExp.$1, (d.getFullYear() + '').substr(4 - RegExp.$1.length))
|
||||
for (const k in o)
|
||||
if (new RegExp('(' + k + ')').test(_format)) _format = _format.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) :
|
||||
(('00' + o[k]).substr(('' + o[k]).length)))
|
||||
return _format
|
||||
}
|
||||
|
||||
/**
|
||||
* 将时间转unix时间戳
|
||||
* @param date
|
||||
* @returns {number} 【秒】
|
||||
*/
|
||||
function dateToUnix (date) {
|
||||
let newStr = date.replace(/:/g, '-')
|
||||
newStr = newStr.replace(/ /g, '-')
|
||||
const arr = newStr.split('-')
|
||||
const datum = new Date(Date.UTC(
|
||||
arr[0],
|
||||
arr[1] - 1,
|
||||
arr[2],
|
||||
arr[3] - 8 || -8,
|
||||
arr[4] || 0,
|
||||
arr[5] || 0
|
||||
))
|
||||
return parseInt(datum.getTime() / 1000)
|
||||
}
|
||||
|
||||
/**
|
||||
* 货币格式化
|
||||
* @param price
|
||||
* @returns {string}
|
||||
*/
|
||||
function formatPrice (price) {
|
||||
if (typeof price !== 'number') return price
|
||||
return String(Number(price).toFixed(2)).replace(/\B(?=(\d{3})+(?!\d))/g, ',')
|
||||
}
|
||||
|
||||
/**
|
||||
* 手机号隐私保护
|
||||
* 隐藏中间四位数字
|
||||
* @param mobile
|
||||
* @returns {*}
|
||||
*/
|
||||
function secrecyMobile (mobile) {
|
||||
mobile = String(mobile)
|
||||
if (!/\d{11}/.test(mobile)) {
|
||||
return mobile
|
||||
}
|
||||
return mobile.replace(/(\d{3})(\d{4})(\d{4})/, '$1****$3')
|
||||
}
|
||||
|
||||
/**
|
||||
* 随机生成指定长度的字符串
|
||||
* @param length
|
||||
* @returns {string}
|
||||
*/
|
||||
function randomString (length = 32) {
|
||||
const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
|
||||
const maxPos = chars.length
|
||||
let _string = ''
|
||||
for (let i = 0; i < length; i++) {
|
||||
_string += chars.charAt(Math.floor(Math.random() * maxPos))
|
||||
}
|
||||
return _string
|
||||
}
|
||||
|
||||
/**
|
||||
* 计算传秒数的倒计时【天、时、分、秒】
|
||||
* @param seconds
|
||||
* @returns {{day : *, hours : *, minutes : *, seconds : *}}
|
||||
*/
|
||||
|
||||
function countTimeDown (seconds) {
|
||||
const leftTime = (time) => {
|
||||
if (time < 10) time = '0' + time
|
||||
return time + ''
|
||||
}
|
||||
return {
|
||||
day: leftTime(parseInt(seconds / 60 / 60 / 24, 10)),
|
||||
hours: leftTime(parseInt(seconds / 60 / 60 % 24, 10)),
|
||||
minutes: leftTime(parseInt(seconds / 60 % 60, 10)),
|
||||
seconds: leftTime(parseInt(seconds % 60, 10))
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 计算当前时间到第二天0点的倒计时[秒]
|
||||
* @returns {number}
|
||||
*/
|
||||
function theNextDayTime () {
|
||||
const nowDate = new Date()
|
||||
const time = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate() + 1, 0, 0, 0).getTime() - nowDate.getTime()
|
||||
return parseInt(time / 1000)
|
||||
}
|
||||
export {
|
||||
unixToDate,
|
||||
dateToUnix,
|
||||
formatPrice,
|
||||
secrecyMobile,
|
||||
randomString,
|
||||
countTimeDown,
|
||||
theNextDayTime
|
||||
}
|
||||
/**
|
||||
* 一些常用的基础方法
|
||||
* unixToDate 将unix时间戳转换为指定格式
|
||||
* dateToUnix 将时间转unix时间戳
|
||||
* deepClone 对一个对象进行深拷贝
|
||||
* formatPrice 货币格式化
|
||||
* secrecyMobile 手机号隐私保护
|
||||
* randomString 随机生成指定长度的字符串
|
||||
*/
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* 验证银行卡号
|
||||
*/
|
||||
export function checkBankno(bankno) {
|
||||
var lastNum = bankno.substr(bankno.length - 1, 1); //取出最后一位(与luhm进行比较)
|
||||
var first15Num = bankno.substr(0, bankno.length - 1); //前15或18位
|
||||
var newArr = [];
|
||||
|
||||
for (var i = first15Num.length - 1; i > -1; i--) {
|
||||
//前15或18位倒序存进数组
|
||||
newArr.push(first15Num.substr(i, 1));
|
||||
}
|
||||
|
||||
var arrJiShu = []; //奇数位*2的积 <9
|
||||
var arrJiShu2 = []; //奇数位*2的积 >9
|
||||
var arrOuShu = []; //偶数位数组
|
||||
for (var j = 0; j < newArr.length; j++) {
|
||||
if ((j + 1) % 2 == 1) {
|
||||
//奇数位
|
||||
if (parseInt(newArr[j]) * 2 < 9) arrJiShu.push(parseInt(newArr[j]) * 2);
|
||||
else arrJiShu2.push(parseInt(newArr[j]) * 2);
|
||||
} //偶数位
|
||||
else arrOuShu.push(newArr[j]);
|
||||
}
|
||||
|
||||
var jishu_child1 = []; //奇数位*2 >9 的分割之后的数组个位数
|
||||
var jishu_child2 = []; //奇数位*2 >9 的分割之后的数组十位数
|
||||
for (var h = 0; h < arrJiShu2.length; h++) {
|
||||
jishu_child1.push(parseInt(arrJiShu2[h]) % 10);
|
||||
jishu_child2.push(parseInt(arrJiShu2[h]) / 10);
|
||||
}
|
||||
|
||||
var sumJiShu = 0; //奇数位*2 < 9 的数组之和
|
||||
var sumOuShu = 0; //偶数位数组之和
|
||||
var sumJiShuChild1 = 0; //奇数位*2 >9 的分割之后的数组个位数之和
|
||||
var sumJiShuChild2 = 0; //奇数位*2 >9 的分割之后的数组十位数之和
|
||||
var sumTotal = 0;
|
||||
for (var m = 0; m < arrJiShu.length; m++) {
|
||||
sumJiShu = sumJiShu + parseInt(arrJiShu[m]);
|
||||
}
|
||||
for (var n = 0; n < arrOuShu.length; n++) {
|
||||
sumOuShu = sumOuShu + parseInt(arrOuShu[n]);
|
||||
}
|
||||
for (var p = 0; p < jishu_child1.length; p++) {
|
||||
sumJiShuChild1 = sumJiShuChild1 + parseInt(jishu_child1[p]);
|
||||
sumJiShuChild2 = sumJiShuChild2 + parseInt(jishu_child2[p]);
|
||||
}
|
||||
//计算总和
|
||||
sumTotal =
|
||||
parseInt(sumJiShu) +
|
||||
parseInt(sumOuShu) +
|
||||
parseInt(sumJiShuChild1) +
|
||||
parseInt(sumJiShuChild2);
|
||||
//计算Luhm值
|
||||
var k = parseInt(sumTotal) % 10 == 0 ? 10 : parseInt(sumTotal) % 10;
|
||||
var luhm = 10 - k;
|
||||
if (lastNum == luhm) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* 将unix时间戳转换为指定格式
|
||||
* @param unix 时间戳【秒】
|
||||
* @param format 转换格式
|
||||
* @returns {*|string}
|
||||
*/
|
||||
function unixToDate (unix, format) {
|
||||
if (!unix) return unix
|
||||
let _format = format || 'yyyy-MM-dd hh:mm:ss'
|
||||
const d = new Date(unix)
|
||||
const o = {
|
||||
'M+': d.getMonth() + 1,
|
||||
'd+': d.getDate(),
|
||||
'h+': d.getHours(),
|
||||
'm+': d.getMinutes(),
|
||||
's+': d.getSeconds(),
|
||||
'q+': Math.floor((d.getMonth() + 3) / 3),
|
||||
S: d.getMilliseconds()
|
||||
}
|
||||
if (/(y+)/.test(_format)) _format = _format.replace(RegExp.$1, (d.getFullYear() + '').substr(4 - RegExp.$1.length))
|
||||
for (const k in o)
|
||||
if (new RegExp('(' + k + ')').test(_format)) _format = _format.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) :
|
||||
(('00' + o[k]).substr(('' + o[k]).length)))
|
||||
return _format
|
||||
}
|
||||
|
||||
/**
|
||||
* 将时间转unix时间戳
|
||||
* @param date
|
||||
* @returns {number} 【秒】
|
||||
*/
|
||||
function dateToUnix (date) {
|
||||
let newStr = date.replace(/:/g, '-')
|
||||
newStr = newStr.replace(/ /g, '-')
|
||||
const arr = newStr.split('-')
|
||||
const datum = new Date(Date.UTC(
|
||||
arr[0],
|
||||
arr[1] - 1,
|
||||
arr[2],
|
||||
arr[3] - 8 || -8,
|
||||
arr[4] || 0,
|
||||
arr[5] || 0
|
||||
))
|
||||
return parseInt(datum.getTime() / 1000)
|
||||
}
|
||||
|
||||
/**
|
||||
* 货币格式化
|
||||
* @param price
|
||||
* @returns {string}
|
||||
*/
|
||||
function formatPrice (price) {
|
||||
if (typeof price !== 'number') return price
|
||||
return String(Number(price).toFixed(2)).replace(/\B(?=(\d{3})+(?!\d))/g, ',')
|
||||
}
|
||||
|
||||
/**
|
||||
* 手机号隐私保护
|
||||
* 隐藏中间四位数字
|
||||
* @param mobile
|
||||
* @returns {*}
|
||||
*/
|
||||
function secrecyMobile (mobile) {
|
||||
mobile = String(mobile)
|
||||
if (!/\d{11}/.test(mobile)) {
|
||||
return mobile
|
||||
}
|
||||
return mobile.replace(/(\d{3})(\d{4})(\d{4})/, '$1****$3')
|
||||
}
|
||||
|
||||
/**
|
||||
* 随机生成指定长度的字符串
|
||||
* @param length
|
||||
* @returns {string}
|
||||
*/
|
||||
function randomString (length = 32) {
|
||||
const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
|
||||
const maxPos = chars.length
|
||||
let _string = ''
|
||||
for (let i = 0; i < length; i++) {
|
||||
_string += chars.charAt(Math.floor(Math.random() * maxPos))
|
||||
}
|
||||
return _string
|
||||
}
|
||||
|
||||
/**
|
||||
* 计算传秒数的倒计时【天、时、分、秒】
|
||||
* @param seconds
|
||||
* @returns {{day : *, hours : *, minutes : *, seconds : *}}
|
||||
*/
|
||||
|
||||
function countTimeDown (seconds) {
|
||||
const leftTime = (time) => {
|
||||
if (time < 10) time = '0' + time
|
||||
return time + ''
|
||||
}
|
||||
return {
|
||||
day: leftTime(parseInt(seconds / 60 / 60 / 24, 10)),
|
||||
hours: leftTime(parseInt(seconds / 60 / 60 % 24, 10)),
|
||||
minutes: leftTime(parseInt(seconds / 60 % 60, 10)),
|
||||
seconds: leftTime(parseInt(seconds % 60, 10))
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 计算当前时间到第二天0点的倒计时[秒]
|
||||
* @returns {number}
|
||||
*/
|
||||
function theNextDayTime () {
|
||||
const nowDate = new Date()
|
||||
const time = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate() + 1, 0, 0, 0).getTime() - nowDate.getTime()
|
||||
return parseInt(time / 1000)
|
||||
}
|
||||
export {
|
||||
unixToDate,
|
||||
dateToUnix,
|
||||
formatPrice,
|
||||
secrecyMobile,
|
||||
randomString,
|
||||
countTimeDown,
|
||||
theNextDayTime
|
||||
}
|
||||
|
||||
@@ -5,7 +5,7 @@ import Storage from './storage';
|
||||
import router from '../router/index.js';
|
||||
import store from '../vuex/store';
|
||||
import { handleRefreshToken } from '@/api/index';
|
||||
import {v4 as uuidv4} from 'uuid';
|
||||
import { v4 as uuidv4} from 'uuid';
|
||||
|
||||
const qs = require('qs');
|
||||
// api地址
|
||||
@@ -88,7 +88,7 @@ service.interceptors.request.use(
|
||||
}
|
||||
);
|
||||
|
||||
async function refresh (error) {
|
||||
async function refresh(error) {
|
||||
const getTokenRes = await refreshToken();
|
||||
if (getTokenRes === 'success') {
|
||||
// 刷新token
|
||||
@@ -121,7 +121,8 @@ async function refresh (error) {
|
||||
});
|
||||
},
|
||||
onCancel: () => {
|
||||
router.go(0)
|
||||
// router.go(0)
|
||||
router.push("/");
|
||||
Modal.remove();
|
||||
}
|
||||
});
|
||||
@@ -141,7 +142,7 @@ service.interceptors.response.use(
|
||||
const errorResponse = error.response || {};
|
||||
const errorData = errorResponse.data || {};
|
||||
|
||||
if (errorResponse.status === 403 || error.response.data.code === 20004) {
|
||||
if (errorResponse.status === 401 || errorResponse.status === 403 || error.response.data.code === 20004) {
|
||||
isRefreshToken++;
|
||||
|
||||
if (isRefreshToken === 1) {
|
||||
|
||||
@@ -97,6 +97,14 @@ const ShopEntry = (resolve) =>
|
||||
|
||||
Vue.use(Router);
|
||||
|
||||
/**
|
||||
* 解决重复点击菜单会控制台报错bug
|
||||
*/
|
||||
const routerPush = Router.prototype.push
|
||||
Router.prototype.push = function push(location) {
|
||||
return routerPush.call(this, location).catch(error=> error)
|
||||
}
|
||||
|
||||
export default new Router({
|
||||
mode: "history",
|
||||
routes: [
|
||||
|
||||
@@ -12,3 +12,9 @@ export const SET_CARTNUM = (state, data) => {
|
||||
export const SET_HOTWORDS = (state, data) => {
|
||||
state.hotWordsList = data
|
||||
}
|
||||
export const SET_LOGOIMG = (state, data) => {
|
||||
state.logoImg = data
|
||||
}
|
||||
export const SET_SITENAME = (state, data) => {
|
||||
state.siteName = data
|
||||
}
|
||||
@@ -11,7 +11,8 @@ export default new Vuex.Store({
|
||||
state: {
|
||||
navList: [], // 首页快捷导航
|
||||
cartNum: storage.getItem('cartNum') || 0,
|
||||
logoImg: require('@/assets/images/logo2.png'),
|
||||
logoImg: storage.getItem('logoImg') || require('@/assets/images/logo2.png'),
|
||||
siteName:storage.getItem('siteName')|| 'lilishop',
|
||||
hotWordsList: storage.getItem('hotWordsList'),
|
||||
category: JSON.parse(localStorage.getItem('category'))
|
||||
},
|
||||
|
||||
@@ -25,15 +25,15 @@ let externals = {
|
||||
|
||||
// 使用CDN的内容
|
||||
let cdn = {
|
||||
css: ["https://cdn.jsdelivr.net/npm/view-design@4.1.1/dist/styles/iview.css"],
|
||||
css: ["https://cdn.pickmall.cn/cdn/iview.css"],
|
||||
js: [
|
||||
// vue must at first!
|
||||
"https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js",
|
||||
"https://cdn.jsdelivr.net/npm/vuex@3.1.2/dist/vuex.min.js",
|
||||
"https://cdn.jsdelivr.net/npm/vue-router@3.1.3/dist/vue-router.min.js",
|
||||
"https://cdn.jsdelivr.net/npm/axios@0.19.2/dist/axios.min.js",
|
||||
"https://cdn.jsdelivr.net/npm/view-design@4.1.1/dist/iview.min.js",
|
||||
"https://cdn.jsdelivr.net/npm/js-cookie@2.2.1/src/js.cookie.min.js"
|
||||
"https://cdn.pickmall.cn/cdn/vue.min.js",
|
||||
"https://cdn.pickmall.cn/cdn/vuex.min.js",
|
||||
"https://cdn.pickmall.cn/cdn/vue-router.min.js",
|
||||
"https://cdn.pickmall.cn/cdn/axios0.19.2.js",
|
||||
"https://cdn.pickmall.cn/cdn/iview.min.js",
|
||||
"https://cdn.pickmall.cn/cdn/js.cookie.min.js",
|
||||
]
|
||||
};
|
||||
|
||||
|
||||
16677
buyer/yarn.lock
16677
buyer/yarn.lock
File diff suppressed because it is too large
Load Diff
18
docker-build.sh
Normal file
18
docker-build.sh
Normal file
@@ -0,0 +1,18 @@
|
||||
#代码目录
|
||||
code_path=$PWD
|
||||
REGISTRY_PATH='registry.cn-hangzhou.aliyuncs.com/lilishop-ui'
|
||||
BUILD_VERSION=4.2.4.1
|
||||
|
||||
read -p "请输入仓库地址": REGISTRY_PATH
|
||||
|
||||
echo $REGISTRY_PATH
|
||||
|
||||
docker build -t $REGISTRY_PATH/buyer-ui:$BUILD_VERSION ${code_path}/buyer
|
||||
docker push $REGISTRY_PATH/buyer-ui:$BUILD_VERSION
|
||||
|
||||
docker build -t $REGISTRY_PATH/seller-ui:$BUILD_VERSION ${code_path}/seller
|
||||
docker push $REGISTRY_PATH/seller-ui:$BUILD_VERSION
|
||||
|
||||
docker build -t $REGISTRY_PATH/manager-ui:$BUILD_VERSION ${code_path}/manager
|
||||
docker push $REGISTRY_PATH/manager-ui:$BUILD_VERSION
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
docker push registry.cn-beijing.aliyuncs.com/lili-images/buyer-ui:4.3.0.1
|
||||
docker push registry.cn-beijing.aliyuncs.com/lili-images/wap-ui:4.3.0.1
|
||||
docker push registry.cn-beijing.aliyuncs.com/lili-images/seller-ui:4.3.0.1
|
||||
docker push registry.cn-beijing.aliyuncs.com/lili-images/manager-ui:4.3.0.1
|
||||
docker push registry.cn-beijing.aliyuncs.com/lili-images/buyer-ui:4.2.4.1
|
||||
docker push registry.cn-beijing.aliyuncs.com/lili-images/wap-ui:4.2.4.1
|
||||
docker push registry.cn-beijing.aliyuncs.com/lili-images/seller-ui:4.2.4.1
|
||||
docker push registry.cn-beijing.aliyuncs.com/lili-images/manager-ui:4.2.4.1
|
||||
|
||||
|
||||
9
lilishop-ui.iml
Normal file
9
lilishop-ui.iml
Normal file
@@ -0,0 +1,9 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="WEB_MODULE" version="4">
|
||||
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
||||
<exclude-output />
|
||||
<content url="file://$MODULE_DIR$" />
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
@@ -1,8 +1,13 @@
|
||||
FROM nginx:alpine
|
||||
FROM node:10.19.0 as build-stage
|
||||
WORKDIR /app
|
||||
COPY package*.json ./
|
||||
RUN npm install
|
||||
COPY . .
|
||||
RUN npm run build
|
||||
|
||||
RUN mkdir -p /app/
|
||||
COPY ./dist /app/
|
||||
# production stage
|
||||
FROM nginx:stable-alpine as production-stage
|
||||
COPY --from=build-stage /app/dist /usr/share/nginx/html
|
||||
COPY ./nginx.conf /etc/nginx/nginx.conf
|
||||
|
||||
|
||||
EXPOSE 80
|
||||
CMD ["nginx", "-g", "daemon off;"]k
|
||||
|
||||
@@ -31,7 +31,7 @@ npm run lint
|
||||
#### login.vue页面,测试时不走权限,直接return 318行
|
||||
#### Main.vue 页面,241行,修改,避免报错
|
||||
|
||||
#### main-components 头部,左侧所有内容
|
||||
#### main-parts 头部,左侧所有内容
|
||||
|
||||
#### lili-floor-renovation 楼层装修模块
|
||||
#### decoration 楼层装修模块
|
||||
|
||||
|
||||
@@ -1 +1 @@
|
||||
docker build -t registry.cn-beijing.aliyuncs.com/lili-images/manager-ui:4.3.0.1 .
|
||||
docker build -t registry.cn-beijing.aliyuncs.com/lili-images/manager-ui:4.2.4.1 .
|
||||
|
||||
@@ -1,51 +1,47 @@
|
||||
#这个文件给docker用的
|
||||
#user nobody;
|
||||
worker_processes 1;
|
||||
worker_processes 1;
|
||||
|
||||
#error_log logs/error.log;
|
||||
#error_log logs/error.log notice;
|
||||
#error_log logs/error.log info;
|
||||
|
||||
#pid logs/nginx.pid;
|
||||
|
||||
|
||||
events {
|
||||
worker_connections 1024;
|
||||
worker_connections 1024;
|
||||
}
|
||||
|
||||
|
||||
http {
|
||||
include mime.types;
|
||||
default_type application/octet-stream;
|
||||
include mime.types;
|
||||
default_type application/octet-stream;
|
||||
|
||||
#log_format main '$remote_addr - $remote_user [$time_local] "$request" '
|
||||
# '$status $body_bytes_sent "$http_referer" '
|
||||
# '"$http_user_agent" "$http_x_forwarded_for"';
|
||||
|
||||
#access_log logs/access.log main;
|
||||
|
||||
sendfile on;
|
||||
sendfile on;
|
||||
#tcp_nopush on;
|
||||
|
||||
#keepalive_timeout 0;
|
||||
keepalive_timeout 65;
|
||||
keepalive_timeout 65;
|
||||
client_max_body_size 10m;
|
||||
gzip on;
|
||||
gzip_min_length 5k;
|
||||
gzip_buffers 4 16k;
|
||||
gzip_min_length 5k;
|
||||
gzip_buffers 4 16k;
|
||||
gzip_http_version 1.0;
|
||||
gzip_comp_level 4;
|
||||
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
|
||||
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
|
||||
gzip_vary on;
|
||||
|
||||
server {
|
||||
listen 10003;
|
||||
server_name localhost;
|
||||
listen 10003;
|
||||
|
||||
location / {
|
||||
root /app;
|
||||
try_files $uri $uri/ /index.html $uri/ =404;
|
||||
index index.html index.htm;
|
||||
index index.html index.htm;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -12,6 +12,7 @@
|
||||
"dependencies": {
|
||||
"@amap/amap-jsapi-loader": "0.0.7",
|
||||
"@antv/g2": "^4.1.12",
|
||||
"@tinymce/tinymce-vue": "^3.2.0",
|
||||
"axios": "^0.21.1",
|
||||
"core-js": "^3.6.5",
|
||||
"dplayer": "^1.26.0",
|
||||
@@ -21,16 +22,16 @@
|
||||
"sockjs-client": "^1.4.0",
|
||||
"swiper": "^6.3.5",
|
||||
"uuid": "^8.3.2",
|
||||
"view-design": "^4.2.0",
|
||||
"view-design": "^4.7.0",
|
||||
"vue": "^2.6.10",
|
||||
"vue-awesome-swiper": "^4.1.1",
|
||||
"vue-i18n": "^8.15.1",
|
||||
"vue-json-excel": "^0.3.0",
|
||||
"vue-print-nb": "^1.7.5",
|
||||
"vue-qr": "^2.3.0",
|
||||
"vue-router": "^3.1.3",
|
||||
"vuedraggable": "^2.23.2",
|
||||
"vuex": "^3.4.0",
|
||||
"wangeditor": "^4.7.5",
|
||||
"xss": "^1.0.7"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@@ -3,10 +3,10 @@ var BASE = {
|
||||
* @description api请求基础路径
|
||||
*/
|
||||
API_DEV: {
|
||||
seller: "http://127.0.0.1:8889",
|
||||
manager: "http://127.0.0.1:8887",
|
||||
buyer: "http://127.0.0.1:8888",
|
||||
common: "http://127.0.0.1:8890",
|
||||
common: "https://common-api.pickmall.cn",
|
||||
buyer: "https://buyer-api.pickmall.cn",
|
||||
seller: "https://store-api.pickmall.cn",
|
||||
manager: "https://admin-api.pickmall.cn"
|
||||
},
|
||||
API_PROD: {
|
||||
common: "https://common-api.pickmall.cn",
|
||||
|
||||
@@ -49,4 +49,7 @@ body {
|
||||
.ivu-tag {
|
||||
cursor: pointer;
|
||||
}
|
||||
.tox-notifications-container{
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import {commonUrl, getRequest, getRequestWithNoToken, postRequestWithNoToken} from '@/libs/axios';
|
||||
import {commonUrl, getRequest, getRequestWithNoToken, postRequestWithNoToken,uploadFileRequest,uploadFile} from '@/libs/axios';
|
||||
|
||||
// 通过id获取子地区
|
||||
export const getChildRegion = (id) => {
|
||||
@@ -19,3 +19,14 @@ export const getVerifyImg = (verificationEnums) => {
|
||||
export const postVerifyImg = (params) => {
|
||||
return postRequestWithNoToken(`${commonUrl}/common/common/slider/${params.verificationEnums}`, params);
|
||||
};
|
||||
|
||||
|
||||
// 获取系统基础信息
|
||||
export const getBaseSite = () => {
|
||||
return getRequest(`${commonUrl}/common/common/site`);
|
||||
};
|
||||
|
||||
// 上传文件
|
||||
export const upLoadFile = (bold) =>{
|
||||
return uploadFileRequest(uploadFile,bold);
|
||||
}
|
||||
|
||||
@@ -58,7 +58,7 @@ export const logout = () => {
|
||||
|
||||
// 刷新token
|
||||
export const handleRefreshToken = (token) => {
|
||||
return getRequestWithNoToken(`/user/refresh/${token}`);
|
||||
return getRequestWithNoToken(`/passport/user/refresh/${token}`);
|
||||
};
|
||||
// 获取用户登录信息
|
||||
export const userInfo = (params) => {
|
||||
@@ -439,11 +439,23 @@ export const setHotWords = (params) => {
|
||||
};
|
||||
|
||||
// 删除热搜词
|
||||
export const deleteHotWords = (words) => {
|
||||
return deleteRequest(`/hotwords/hotwords/${words}`);
|
||||
export const deleteHotWords = (params) => {
|
||||
return deleteRequest(`/hotwords/hotwords`,params);
|
||||
};
|
||||
|
||||
// 获取热搜词
|
||||
export const getHotWords = () => {
|
||||
return getRequest(`/hotwords/hotwords`);
|
||||
};
|
||||
|
||||
// 获取热词统计
|
||||
export const getHotWordsStatistics = (params) => {
|
||||
return getRequest(`/hotwords/hotwords/statistics`,params);
|
||||
};
|
||||
|
||||
// 获取历史热词
|
||||
export const getHotWordsHistory = (params) => {
|
||||
return getRequest(`/hotwords/hotwords/history`,params);
|
||||
};
|
||||
|
||||
|
||||
|
||||
@@ -1,25 +1,28 @@
|
||||
// 统一请求路径前缀在libs/axios.js中修改
|
||||
import {getRequest, putRequest, postRequest, deleteRequest} from "@/libs/axios";
|
||||
import {
|
||||
getRequest,
|
||||
putRequest,
|
||||
postRequest,
|
||||
deleteRequest,
|
||||
} from "@/libs/axios";
|
||||
|
||||
// 获取分页
|
||||
export const getMember = params => {
|
||||
export const getMember = (params) => {
|
||||
return getRequest("/member/getByPage", params);
|
||||
};
|
||||
|
||||
|
||||
// 分页获取会员评价
|
||||
export const getMemberReview = params => {
|
||||
export const getMemberReview = (params) => {
|
||||
return getRequest("/member/evaluation/getByPage", params);
|
||||
};
|
||||
|
||||
// 获取id
|
||||
export const getMemberInfoReview = id => {
|
||||
export const getMemberInfoReview = (id) => {
|
||||
return getRequest(`/member/evaluation/get/${id}`);
|
||||
};
|
||||
|
||||
|
||||
// 删除评论
|
||||
export const delMemberReview = id => {
|
||||
export const delMemberReview = (id) => {
|
||||
return putRequest(`/member/evaluation/delete/${id}`);
|
||||
};
|
||||
// 修改评价状态
|
||||
@@ -27,14 +30,13 @@ export const updateMemberReview = (id, params) => {
|
||||
return getRequest(`/member/evaluation/updateStatus/${id}`, params);
|
||||
};
|
||||
|
||||
|
||||
// 添加或修改
|
||||
export const insertOrUpdateSpec = params => {
|
||||
export const insertOrUpdateSpec = (params) => {
|
||||
return postRequest("/memberNoticeSenter/insertOrUpdate", params);
|
||||
};
|
||||
|
||||
// 获取会员列表
|
||||
export const getMemberListData = params => {
|
||||
export const getMemberListData = (params) => {
|
||||
return getRequest("/passport/member", params);
|
||||
};
|
||||
|
||||
@@ -45,11 +47,11 @@ export const getMemberInfoData = (id) => {
|
||||
|
||||
// 修改会员基本信息
|
||||
export const updateMember = (params) => {
|
||||
return putRequest(`/member`, params);
|
||||
return putRequest(`/passport/member`, params);
|
||||
};
|
||||
|
||||
// 添加会员基本信息
|
||||
export const addMember = params => {
|
||||
export const addMember = (params) => {
|
||||
return postRequest(`/passport/member`, params);
|
||||
};
|
||||
|
||||
@@ -59,85 +61,79 @@ export const getMemberAll = () => {
|
||||
};
|
||||
|
||||
// 增加或修改会员列表
|
||||
export const operationMemberListData = params => {
|
||||
export const operationMemberListData = (params) => {
|
||||
return postRequest("/passport/member/insertOrUpdate", params);
|
||||
};
|
||||
|
||||
// 增加或修改会员列表
|
||||
export const deleteMemberListData = ids => {
|
||||
export const deleteMemberListData = (ids) => {
|
||||
return deleteRequest(`/passport/member/delByIds/${ids}`);
|
||||
};
|
||||
// 获取充值记录列表数据
|
||||
export const getUserRecharge = params => {
|
||||
export const getUserRecharge = (params) => {
|
||||
return getRequest("/wallet/recharge", params);
|
||||
};
|
||||
|
||||
// 获取预存款明细列表数据
|
||||
export const getUserWallet = params => {
|
||||
export const getUserWallet = (params) => {
|
||||
return getRequest("/wallet/log", params);
|
||||
};
|
||||
|
||||
// 获取提现申请列表数据
|
||||
export const getUserWithdrawApply = params => {
|
||||
export const getUserWithdrawApply = (params) => {
|
||||
return getRequest("/wallet/withdrawApply", params);
|
||||
};
|
||||
|
||||
// 审核提现申请
|
||||
export const withdrawApply = params => {
|
||||
export const withdrawApply = (params) => {
|
||||
return postRequest("/wallet/withdrawApply", params);
|
||||
};
|
||||
|
||||
//会员状态修改
|
||||
export const updateMemberStatus = params => {
|
||||
export const updateMemberStatus = (params) => {
|
||||
return putRequest("/passport/member/updateMemberStatus", params);
|
||||
};
|
||||
|
||||
// 获取会员注册统计列表
|
||||
export const getMemberStatistics = params => {
|
||||
export const getMemberStatistics = (params) => {
|
||||
return getRequest("/statistics/member", params);
|
||||
};
|
||||
|
||||
|
||||
// 获取流量统计
|
||||
export const getStatisticsList = params => {
|
||||
export const getStatisticsList = (params) => {
|
||||
return getRequest("/statistics/view/list", params);
|
||||
};
|
||||
|
||||
// 获取会员历史流量
|
||||
export const historyMemberChartList = () => {
|
||||
return getRequest("/statistics/view/online/history");
|
||||
}
|
||||
};
|
||||
|
||||
//查询会员数量
|
||||
export const getMemberNum = params => {
|
||||
export const getMemberNum = (params) => {
|
||||
return getRequest("/passport/member/num", params);
|
||||
};
|
||||
//查询会员历史积分
|
||||
export const getHistoryPointData = (params) => {
|
||||
return getRequest(`/member/memberPointsHistory/getByPage`, params)
|
||||
}
|
||||
return getRequest(`/member/memberPointsHistory/getByPage`, params);
|
||||
};
|
||||
//查询会员的收货地址
|
||||
export const getMemberAddressData = (id, params) => {
|
||||
return getRequest(`/member/address/${id}`, params)
|
||||
}
|
||||
return getRequest(`/member/address/${id}`, params);
|
||||
};
|
||||
//删除会员地址
|
||||
export const removeMemberAddress = (id) => {
|
||||
return deleteRequest(`/member/address/delById/${id}`)
|
||||
}
|
||||
return deleteRequest(`/member/address/delById/${id}`);
|
||||
};
|
||||
//添加会员收货地址
|
||||
export const addMemberAddress = (params) => {
|
||||
return postRequest(`/member/address`, params)
|
||||
}
|
||||
return postRequest(`/member/address`, params);
|
||||
};
|
||||
//修改会员收货地址
|
||||
export const editMemberAddress = (params) => {
|
||||
return putRequest(`/member/address`, params)
|
||||
}
|
||||
return putRequest(`/member/address`, params);
|
||||
};
|
||||
//查询会员预存款
|
||||
export const getMemberWallet = (params) => {
|
||||
return getRequest(`/wallet/wallet`, params)
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
return getRequest(`/wallet/wallet`, params);
|
||||
};
|
||||
|
||||
@@ -90,3 +90,12 @@ export const getMemberFeedbackDetail = (id) => {
|
||||
export const getMemberMessage = (params) => {
|
||||
return getRequest(`/other/memberMessage`, params);
|
||||
};
|
||||
|
||||
// 弹窗广告
|
||||
export const getOpenHomeData = params => {
|
||||
return getRequest(`/other/pageData/pageType/${params}`);
|
||||
};
|
||||
// 保存修改弹窗广告
|
||||
export const addOpenHomeData = params => {
|
||||
return postRequest(`/other/pageData/pageType/${params}`);
|
||||
};
|
||||
|
||||
@@ -105,3 +105,14 @@ export const getArticle = (params) => {
|
||||
export const delArticle = (ids) => {
|
||||
return deleteRequest(`/other/article/delByIds/${ids}`)
|
||||
}
|
||||
|
||||
|
||||
|
||||
//获取隐私协议数据
|
||||
export const getPrivacy = (type) => {
|
||||
return getRequest(`/other/article/type/${type}`)
|
||||
}
|
||||
//修改隐私协议数据
|
||||
export const updatePrivacy = (id,type,params) => {
|
||||
return putRequest(`/other/article/updateArticle/${type}?id=${id}`, params, {"Content-Type": "application/json"})
|
||||
}
|
||||
@@ -41,7 +41,7 @@ export const getPromotionGoods = (promotionId, params) => {
|
||||
|
||||
// 获取当前进行中的促销活动
|
||||
export const getAllPromotion = params => {
|
||||
return getRequest("/promotion/current", params);
|
||||
return getRequest("/promotion/promotion/current", params);
|
||||
};
|
||||
|
||||
// 获取拼团数据
|
||||
|
||||
BIN
manager/src/assets/align-text-center.png
Normal file
BIN
manager/src/assets/align-text-center.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 270 B |
BIN
manager/src/assets/align-text-left.png
Normal file
BIN
manager/src/assets/align-text-left.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 266 B |
BIN
manager/src/assets/align-text-right.png
Normal file
BIN
manager/src/assets/align-text-right.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 271 B |
@@ -4,9 +4,9 @@
|
||||
<span @click="clickBreadcrumb(item,index)" :class="{'active':item.selected}" v-for="(item,index) in dateList"
|
||||
:key="index"> {{item.title}}</span>
|
||||
<div class="date-picker">
|
||||
<Select @on-change="changeSelect(selectedWay)" v-model="month" placeholder="年月查询"
|
||||
<Select @on-change="changeSelect(selectedWay)" v-model="month" placeholder="年月查询" clearable
|
||||
style="width:200px;margin-left:10px;">
|
||||
<Option v-for="(item,index) in dates" :value="item.year+'-'+item.month" :key="index">
|
||||
<Option v-for="(item,index) in dates" :value="item.year+'-'+item.month" :key="index" clearable>
|
||||
{{ item.year+'年'+item.month+'月' }}</Option>
|
||||
</Select>
|
||||
</div>
|
||||
61
manager/src/components/editor/config.js
Normal file
61
manager/src/components/editor/config.js
Normal file
@@ -0,0 +1,61 @@
|
||||
import plugins from "./plugins";
|
||||
import toobar from "./toolbar";
|
||||
import { upLoadFile } from "@/api/common";
|
||||
|
||||
export const initEditor = {
|
||||
height: "400px",
|
||||
language: "zh_CN",
|
||||
menubar: "file edit insert view format table", // 菜单:指定应该出现哪些菜单
|
||||
toolbar: toobar, // 分组工具栏控件
|
||||
plugins: plugins, // 插件(比如: advlist | link | image | preview等)
|
||||
object_resizing: false, // 是否禁用表格图片大小调整
|
||||
end_container_on_empty_block: true, // enter键 分块
|
||||
powerpaste_word_import: "merge", // 是否保留word粘贴样式 clean | merge
|
||||
code_dialog_height: 450, // 代码框高度 、宽度
|
||||
code_dialog_width: 1000,
|
||||
advlist_bullet_styles: "square", // 无序列表 有序列表
|
||||
maxSize: "2097152", // 设置图片大小
|
||||
accept: "image/jpeg, image/png", // 设置图片上传规则
|
||||
images_upload_handler: async function (blobInfo, success, failure) {
|
||||
console.log("请求")
|
||||
const formData = new FormData();
|
||||
formData.append("file", blobInfo.blob());
|
||||
try {
|
||||
const res = await upLoadFile(formData);
|
||||
if (res.result) {
|
||||
|
||||
success(res.result)
|
||||
} else {
|
||||
failure("上传文件有误请稍后重试");
|
||||
}
|
||||
} catch (e) {
|
||||
failure('上传出错')
|
||||
}
|
||||
},
|
||||
// init_instance_callback: function (editor) {
|
||||
// var freeTiny = document.querySelector(".tox .tox-notification--in");
|
||||
// freeTiny.style.display = "none";
|
||||
// },
|
||||
content_style: `
|
||||
* { padding:0; margin:0; }
|
||||
|
||||
html, body height:100%; }
|
||||
|
||||
img { max-width:100%; display:block;height:auto; }
|
||||
|
||||
a { text-decoration: none; }
|
||||
|
||||
iframe{ width: 100%; }
|
||||
|
||||
p { line-height:1.6; margin: 0px; }
|
||||
|
||||
table{ word-wrap:break-word; word-break:break-all; max-width:100%; border:none; border-color:#999; }
|
||||
|
||||
.mce-object-iframe{ width:100%; box-sizing:border-box; margin:0; padding:0; }
|
||||
|
||||
ul,ol{ list-style-position:inside; }
|
||||
`, // 设置样式
|
||||
statusbar: false, // 隐藏编辑器底部的状态栏
|
||||
elementpath: false, // 禁用编辑器底部的状态栏
|
||||
paste_data_images: true, // 允许粘贴图像
|
||||
};
|
||||
4
manager/src/components/editor/plugins.js
Normal file
4
manager/src/components/editor/plugins.js
Normal file
@@ -0,0 +1,4 @@
|
||||
const plugins = [
|
||||
'advlist anchor autolink autosave code codesample colorpicker colorpicker contextmenu directionality emoticons fullscreen hr image imagetools importcss insertdatetime link lists media nonbreaking noneditable pagebreak paste preview print save searchreplace spellchecker tabfocus table template textcolor textpattern visualblocks visualchars wordcount'
|
||||
]
|
||||
export default plugins
|
||||
2
manager/src/components/editor/toolbar.js
Normal file
2
manager/src/components/editor/toolbar.js
Normal file
@@ -0,0 +1,2 @@
|
||||
const toolbar = ['searchreplace bold italic underline strikethrough alignleft aligncenter alignright outdent indent blockquote undo redo removeformat subscript superscript code codesample', 'hr bullist numlist link image charmap preview anchor pagebreak insertdatetime media table emoticons forecolor backcolor ']
|
||||
export default toolbar
|
||||
BIN
manager/src/components/hotzone/assets/styles/icons8-edit-64.png
Normal file
BIN
manager/src/components/hotzone/assets/styles/icons8-edit-64.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
657
manager/src/components/hotzone/assets/styles/main.css
Normal file
657
manager/src/components/hotzone/assets/styles/main.css
Normal file
@@ -0,0 +1,657 @@
|
||||
.hz-m-wrap {
|
||||
position: relative;
|
||||
/*overflow: hidden;*/
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-u-img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
/* max-height: 100%; */
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-area {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
cursor: crosshair;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-item {
|
||||
position: absolute;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-shadow: 0 0 6px #000;
|
||||
background-color: #e31414;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
opacity: 0.8;
|
||||
}
|
||||
.hz-m-box{
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box>li {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box.hz-z-hidden>li {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box.hz-m-hoverbox:hover {
|
||||
box-shadow: 0 0 0 2px #373950;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box.hz-m-hoverbox .hz-icon:hover {
|
||||
background-color: #373950;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-icon:hover {
|
||||
background-color: #e31414;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-index {
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
background-color: #000;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-close {
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-m-copy {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-small-icon {
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
border-radius: 4px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square-tl {
|
||||
top: -4px;
|
||||
left: -4px;
|
||||
cursor: nw-resize;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square-tc {
|
||||
top: -4px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
cursor: n-resize;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square-tr {
|
||||
top: -4px;
|
||||
right: -4px;
|
||||
cursor: ne-resize;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square-cl {
|
||||
top: 50%;
|
||||
left: -4px;
|
||||
transform: translateY(-50%);
|
||||
cursor: w-resize;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square-cr {
|
||||
top: 50%;
|
||||
right: -4px;
|
||||
transform: translateY(-50%);
|
||||
cursor: w-resize;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square-bl {
|
||||
bottom: -4px;
|
||||
left: -4px;
|
||||
cursor: sw-resize;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square-bc {
|
||||
bottom: -4px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
cursor: s-resize;
|
||||
}
|
||||
|
||||
.hz-m-wrap .hz-m-box .hz-u-square-br {
|
||||
bottom: -4px;
|
||||
right: -4px;
|
||||
cursor: se-resize;
|
||||
}
|
||||
|
||||
/* reset */
|
||||
.hz-m-modal,
|
||||
.hz-m-wrap {
|
||||
font-size: 12px;
|
||||
/* 清除内外边距 */
|
||||
/* 重置列表元素 */
|
||||
/* 重置文本格式元素 */
|
||||
/* 初始化 input */
|
||||
}
|
||||
|
||||
.hz-m-modal ul,
|
||||
.hz-m-wrap ul,
|
||||
.hz-m-modal ol,
|
||||
.hz-m-wrap ol,
|
||||
.hz-m-modal li,
|
||||
.hz-m-wrap li {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.hz-m-modal ul,
|
||||
.hz-m-wrap ul,
|
||||
.hz-m-modal ol,
|
||||
.hz-m-wrap ol {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.hz-m-modal a,
|
||||
.hz-m-wrap a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.hz-m-modal a:hover,
|
||||
.hz-m-wrap a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.hz-m-modal p,
|
||||
.hz-m-wrap p {
|
||||
-webkit-margin-before: 0;
|
||||
-webkit-margin-after: 0;
|
||||
}
|
||||
|
||||
.hz-m-modal input[type="checkbox"],
|
||||
.hz-m-wrap input[type="checkbox"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* basic */
|
||||
/* modal 样式 */
|
||||
.hz-m-modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
touch-action: cross-slide-y pinch-zoom double-tap-zoom;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.hz-m-modal:before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_dialog {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
text-align: left;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_close {
|
||||
float: right;
|
||||
margin: -6px -4px 0 0;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.hz-m-modal .hz-modal_dialog {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
html.z-modal,
|
||||
html.z-modal body {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.hz-m-modal {
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_dialog {
|
||||
width: 450px;
|
||||
background: #fff;
|
||||
-webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
|
||||
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_hd {
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid #f4f4f4;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_title {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_close {
|
||||
margin: -15px -15px 0 0;
|
||||
padding: 6px;
|
||||
color: #bbb;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_close:hover {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_close .hz-u-icon-close {
|
||||
font-size: 18px;
|
||||
transition: transform 500ms ease-in-out;
|
||||
transform: rotate(0deg);
|
||||
width: 18px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_close:hover .hz-u-icon-close {
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_bd {
|
||||
padding: 15px 15px 0 15px;
|
||||
min-height: 10px;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_ft {
|
||||
padding: 15px;
|
||||
text-align: center;
|
||||
border-top: 1px solid #f4f4f4;
|
||||
}
|
||||
|
||||
.hz-m-modal .hz-modal_ft .hz-u-btn {
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.hz-m-modal .hz-modal_dialog {
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 基本按钮样式 btn */
|
||||
.hz-u-btn {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-webkit-appearance: none;
|
||||
border: none;
|
||||
overflow: visible;
|
||||
font: inherit;
|
||||
text-transform: none;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
background: none;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.hz-u-btn:hover,
|
||||
.hz-u-btn:focus {
|
||||
outline: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.hz-u-btn:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.hz-u-btn-block {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hz-u-btn {
|
||||
padding: 0 16px;
|
||||
height: 28px;
|
||||
line-height: 26px;
|
||||
background: #f4f4f4;
|
||||
color: #444;
|
||||
border: 1px solid #ddd;
|
||||
-moz-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.hz-u-btn:hover,
|
||||
.hz-u-btn:focus {
|
||||
background: #e5e5e5;
|
||||
border: 1px solid #adadad;
|
||||
}
|
||||
|
||||
.hz-u-btn:active {
|
||||
background: #e5e5e5;
|
||||
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
||||
}
|
||||
|
||||
.hz-u-btn:disabled {
|
||||
background: #fff;
|
||||
border: 1px solid #ccc;
|
||||
filter: alpha(opacity=65);
|
||||
opacity: 0.65;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* 按钮类型 */
|
||||
.hz-u-btn-primary {
|
||||
background: #67739b;
|
||||
color: #fff;
|
||||
border: 1px solid #67739b;
|
||||
}
|
||||
|
||||
.hz-u-btn-primary:hover,
|
||||
.hz-u-btn-primary:focus {
|
||||
background: #31384b;
|
||||
color: #fff;
|
||||
border: 1px solid #31384b;
|
||||
}
|
||||
|
||||
.hz-u-btn-primary:active {
|
||||
background: #367fa9;
|
||||
color: #fff;
|
||||
border: 1px solid #367fa9;
|
||||
}
|
||||
|
||||
.hz-u-btn-primary:disabled {
|
||||
background: #444;
|
||||
color: #fff;
|
||||
border: 1px solid #444;
|
||||
}
|
||||
|
||||
/* input */
|
||||
.hz-u-input {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
font: inherit;
|
||||
color: inherit;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.hz-u-input {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
padding: 5px 6px;
|
||||
border: 1px solid #d2d6de;
|
||||
color: #555;
|
||||
background: #fff;
|
||||
-moz-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.hz-u-input::-webkit-input-placeholder {
|
||||
color: #bbb;
|
||||
filter: alpha(opacity=100);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hz-u-input::-moz-placeholder {
|
||||
color: #bbb;
|
||||
filter: alpha(opacity=100);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hz-u-input:-moz-placeholder {
|
||||
color: #bbb;
|
||||
filter: alpha(opacity=100);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hz-u-input:-ms-placeholder {
|
||||
color: #bbb;
|
||||
filter: alpha(opacity=100);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hz-u-input:focus {
|
||||
outline: 0;
|
||||
background: #fff;
|
||||
color: #555;
|
||||
border: 1px solid #3c8dbc;
|
||||
}
|
||||
|
||||
.hz-u-input:disabled {
|
||||
cursor: not-allowed;
|
||||
background: #eee;
|
||||
color: #999;
|
||||
border: 1px solid #d2d6de;
|
||||
}
|
||||
|
||||
.hz-u-input {
|
||||
width: 280px;
|
||||
height: 34px;
|
||||
}
|
||||
|
||||
.hz-u-input.hz-u-input-success {
|
||||
color: #00a65a;
|
||||
border-color: #00a65a;
|
||||
}
|
||||
|
||||
.hz-u-input.hz-u-input-warning {
|
||||
color: #f39c12;
|
||||
border-color: #f39c12;
|
||||
}
|
||||
|
||||
.hz-u-input.hz-u-input-error {
|
||||
color: #dd4b39;
|
||||
border-color: #dd4b39;
|
||||
}
|
||||
|
||||
.hz-u-input.hz-u-input-blank {
|
||||
border-color: transparent;
|
||||
border-style: dashed;
|
||||
background: none;
|
||||
}
|
||||
|
||||
.hz-u-input.hz-u-input-blank:focus {
|
||||
border-color: #ddd;
|
||||
}
|
||||
|
||||
/* formItem */
|
||||
.hz-u-formitem {
|
||||
display: inline-block;
|
||||
*zoom: 1;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.hz-u-formitem:before,
|
||||
.hz-u-formitem:after {
|
||||
display: table;
|
||||
content: "";
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
.hz-u-formitem:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.hz-u-formitem .hz-formitem_tt {
|
||||
display: block;
|
||||
float: left;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.hz-u-formitem .hz-formitem_ct {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.hz-u-formitem .hz-formitem_rqr {
|
||||
line-height: 28px;
|
||||
color: #dd4b39;
|
||||
}
|
||||
|
||||
.hz-u-formitem .hz-formitem_tt {
|
||||
line-height: 34px;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.hz-u-formitem .hz-formitem_ct {
|
||||
line-height: 34px;
|
||||
margin-left: 108px;
|
||||
}
|
||||
|
||||
/* icon */
|
||||
.hz-u-icon {
|
||||
display: inline-block;
|
||||
font: normal normal normal 14px/1 FontAwesome;
|
||||
font-size: inherit;
|
||||
text-rendering: auto;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
/* label */
|
||||
.hz-u-label {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* margin */
|
||||
.hz-f-ml0 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* replicator */
|
||||
.hz-u-copy input[data-for-copy] {
|
||||
transform: translateZ(0);
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
opacity: 0;
|
||||
overflow: hidden;
|
||||
z-index: -999;
|
||||
color: transparent;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'iconfont';
|
||||
/* project id 525460 */
|
||||
src: url('//at.alicdn.com/t/font_525460_d0ysfwzacahsemi.eot');
|
||||
src: url('//at.alicdn.com/t/font_525460_d0ysfwzacahsemi.eot?#iefix') format('embedded-opentype'), url('//at.alicdn.com/t/font_525460_d0ysfwzacahsemi.woff') format('woff'), url('//at.alicdn.com/t/font_525460_d0ysfwzacahsemi.ttf') format('truetype'), url('//at.alicdn.com/t/font_525460_d0ysfwzacahsemi.svg#iconfont') format('svg');
|
||||
}
|
||||
|
||||
.hz-icon {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
text-align: center;
|
||||
user-select: none;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.hz-icon-edit {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.hz-flex-img {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.hz-flex-img img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.hz-icon-trash:before {
|
||||
content: "\e605";
|
||||
}
|
||||
|
||||
.hz-edit-img {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
.hz-edit-img img {
|
||||
max-width: 300px;
|
||||
max-height: 200px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.hz-edit-del {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
293
manager/src/components/hotzone/components/Hotzone.vue
Normal file
293
manager/src/components/hotzone/components/Hotzone.vue
Normal file
@@ -0,0 +1,293 @@
|
||||
<template>
|
||||
<div class="hotzone-box">
|
||||
<div class="hotzone-item">
|
||||
<div ref="content" class="hz-m-wrap">
|
||||
<img class="hz-u-img" :src="image" />
|
||||
<ul class="hz-m-area" v-add-item>
|
||||
<zone
|
||||
class="hz-m-item"
|
||||
v-for="(zone, index) in zones"
|
||||
:key="index"
|
||||
:index="index"
|
||||
:setting="zone"
|
||||
:ref="`zone${index}`"
|
||||
@delItem="removeItem($event)"
|
||||
@changeInfo="changeInfo($event)"
|
||||
></zone>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="hotzone-add-box-body">
|
||||
<div
|
||||
v-for="(zone, index) in zones"
|
||||
:key="index"
|
||||
class="hotzone-box-item-main"
|
||||
>
|
||||
<div class="hotzone-box-item wes-2">
|
||||
<div>{{ index + 1 }}</div>
|
||||
<div @click="editZone(index)">
|
||||
<div class="hotzone-box-item-text">
|
||||
{{ showZoneText(zone) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<div class="hotzone-btn" @click="editZone(index)">修改</div>
|
||||
|
||||
<div class="hotzone-btn" @click="delZone(index)">删除</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hotzone-add-box-footer" @click="addHotzone">
|
||||
<svg
|
||||
viewBox="64 64 896 896"
|
||||
focusable="false"
|
||||
class=""
|
||||
data-icon="plus"
|
||||
width="1em"
|
||||
height="1em"
|
||||
fill="currentColor"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<path
|
||||
d="M482 152h60q8 0 8 8v704q0 8-8 8h-60q-8 0-8-8V160q0-8 8-8z"
|
||||
></path>
|
||||
<path
|
||||
d="M176 474h672q8 0 8 8v60q0 8-8 8H176q-8 0-8-8v-60q0-8 8-8z"
|
||||
></path>
|
||||
</svg>
|
||||
<div class="hotzone-add-box-text">添加热区</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Zone from "./Zone";
|
||||
import addItem from "../directives/addItem";
|
||||
|
||||
export default {
|
||||
name: "HotZone",
|
||||
data() {
|
||||
return {
|
||||
zones: [],
|
||||
};
|
||||
},
|
||||
props: {
|
||||
image: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
zonesInit: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
max: {
|
||||
type: Number,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.zones = this.zonesInit.concat();
|
||||
},
|
||||
methods: {
|
||||
async addHotzone() {
|
||||
let perInfo = {
|
||||
topPer: 0.15,
|
||||
leftPer: 0.3,
|
||||
widthPer: 0.2,
|
||||
heightPer: 0.2,
|
||||
img: "",
|
||||
link: "",
|
||||
type: "",
|
||||
title: "",
|
||||
};
|
||||
let images = await this.getImageSize(this.image);
|
||||
if (images) {
|
||||
if (images.height >= 1000) {
|
||||
perInfo.heightPer = this.convertNumberToDecimal(images.height) / (images.height / 1000);
|
||||
} else {
|
||||
perInfo.heightPer = this.convertNumberToDecimal(images.height);
|
||||
}
|
||||
perInfo.widthPer = this.convertNumberToDecimal(images.width) / 2;
|
||||
}
|
||||
this.addItem(perInfo);
|
||||
},
|
||||
convertNumberToDecimal(num) {
|
||||
if (num >= 10000) {
|
||||
return num / 100000;
|
||||
} else if (num >= 1000) {
|
||||
return num / 10000;
|
||||
} else if (num >= 100) {
|
||||
return num / 1000;
|
||||
} else if (num >= 10) {
|
||||
return num / 100;
|
||||
}
|
||||
},
|
||||
getImageSize(url) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
let image = new Image();
|
||||
image.onload = function () {
|
||||
resolve({
|
||||
width: image.width,
|
||||
height: image.height,
|
||||
});
|
||||
};
|
||||
image.onerror = function () {
|
||||
reject(new Error("error"));
|
||||
};
|
||||
image.src = url;
|
||||
});
|
||||
},
|
||||
editZone(index) {
|
||||
this.$refs[`zone${index}`][0].showModalFn(index);
|
||||
},
|
||||
delZone(index) {
|
||||
this.$refs[`zone${index}`][0].delItem(index);
|
||||
},
|
||||
showZoneText(zone) {
|
||||
switch (zone.type) {
|
||||
case "goods":
|
||||
return `商品:${zone.goodsName}`;
|
||||
case "category":
|
||||
return `分类:${zone.name}`;
|
||||
case "shops":
|
||||
return `店铺:${zone.storeName}`;
|
||||
case "pages":
|
||||
return `文章:${zone.title}`;
|
||||
case "marketing":
|
||||
return `促销活动商品:${zone.goodsName}`;
|
||||
case "other":
|
||||
return `${zone.title}`;
|
||||
default:
|
||||
return "请选择跳转链接";
|
||||
}
|
||||
},
|
||||
changeInfo(res) {
|
||||
let { info, index, zoneInfo } = res;
|
||||
info = { ...zoneInfo, ...info };
|
||||
// 改变热区并发送change通知
|
||||
Object.assign(this.zones[index], info);
|
||||
this.hasChange("changeInfo");
|
||||
this.$forceUpdate();
|
||||
},
|
||||
addItem(setting) {
|
||||
this.zones.push(setting);
|
||||
this.$emit("choose");
|
||||
// this.hasChange() 不应该发送通知,mouseup判定成功才应该发
|
||||
// this.$emit('add', setting)
|
||||
},
|
||||
eraseItem(index = this.zones.length - 1) {
|
||||
this.zones.splice(index, 1);
|
||||
this.$emit("erase", index);
|
||||
},
|
||||
isOverRange() {
|
||||
let { max, zones } = this;
|
||||
|
||||
return max && zones.length > max;
|
||||
},
|
||||
overRange() {
|
||||
const index = this.zones.length - 1;
|
||||
|
||||
this.zones.splice(index, 1);
|
||||
this.$emit("overRange", index);
|
||||
},
|
||||
removeItem(index = this.zones.length - 1) {
|
||||
this.zones.splice(index, 1);
|
||||
this.hasChange("removeItem");
|
||||
this.$emit("remove", index);
|
||||
},
|
||||
changeItem(info, isAdd) {
|
||||
const index = this.zones.length - 1;
|
||||
// 改变热区并发送change通知
|
||||
Object.assign(this.zones[index], info);
|
||||
this.hasChange("changeItem");
|
||||
isAdd && this.$emit("add", this.zones[index]);
|
||||
},
|
||||
hasChange(from) {
|
||||
this.$emit("change", this.zones);
|
||||
},
|
||||
},
|
||||
directives: {
|
||||
addItem,
|
||||
},
|
||||
components: {
|
||||
Zone,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "../assets/styles/main.css";
|
||||
.hotzone-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 468px;
|
||||
> div {
|
||||
margin: 6px;
|
||||
padding: 12px;
|
||||
border-radius: 10px;
|
||||
height: 100%;
|
||||
}
|
||||
> div:nth-of-type(1) {
|
||||
// display: flex;
|
||||
width: 50%;
|
||||
overflow: auto;
|
||||
// justify-content: center;
|
||||
background: #ededed;
|
||||
}
|
||||
> div:nth-of-type(2) {
|
||||
width: 50%;
|
||||
background: #f7f7f7;
|
||||
}
|
||||
}
|
||||
|
||||
.hotzone-add-box-body {
|
||||
height: 90%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.hotzone-box-item-main {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.hotzone-box-item {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
border-bottom: 1px solid #ededed;
|
||||
font-size: 12px;
|
||||
justify-content: space-between;
|
||||
padding: 5px 10px 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hotzone-add-box-footer {
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
color: #ff5c58;
|
||||
display: flex;
|
||||
height: 40px;
|
||||
justify-content: center;
|
||||
margin-top: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.hotzone-btn {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.hotzone-box-item-text {
|
||||
width: 200px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.hotzone-add-box-text {
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
margin: 0 0 0 4px;
|
||||
}
|
||||
</style>
|
||||
244
manager/src/components/hotzone/components/Zone.vue
Normal file
244
manager/src/components/hotzone/components/Zone.vue
Normal file
@@ -0,0 +1,244 @@
|
||||
<template>
|
||||
<li
|
||||
v-drag-item
|
||||
:style="{
|
||||
top: zoneTop,
|
||||
left: zoneLeft,
|
||||
width: zoneWidth,
|
||||
height: zoneHeight,
|
||||
}"
|
||||
>
|
||||
<ul
|
||||
v-change-size
|
||||
class="hz-m-box"
|
||||
:class="{
|
||||
'hz-z-hidden': tooSmall,
|
||||
'hz-m-hoverbox': !hideZone,
|
||||
}"
|
||||
>
|
||||
<li class="hz-u-index" :title="`热区${index + 1}`">{{ index + 1 }}</li>
|
||||
|
||||
<li
|
||||
title="删除该热区"
|
||||
v-show="!hideZone"
|
||||
class="hz-u-close hz-icon hz-icon-trash"
|
||||
@click.prevent.stop="delItem(index)"
|
||||
@mousedown.stop
|
||||
@mouseup.stop
|
||||
@mousemove.stop
|
||||
></li>
|
||||
<li
|
||||
title="编辑该热区"
|
||||
v-show="!hideZone"
|
||||
class="hz-u-close hz-icon hz-icon-edit"
|
||||
@click.prevent.stop="showModalFn(index)"
|
||||
@mousedown.stop
|
||||
@mouseup.stop
|
||||
@mousemove.stop
|
||||
>
|
||||
<img width="17" height="17" src="../assets/styles/icons8-edit-64.png"></img>
|
||||
</li>
|
||||
<li class="hz-flex-img">
|
||||
<img class="hz-u-img" :src="zoneForm.img" />
|
||||
</li>
|
||||
<li class="hz-u-square hz-u-square-tl" data-pointer="dealTL"></li>
|
||||
<li class="hz-u-square hz-u-square-tc" data-pointer="dealTC"></li>
|
||||
<li class="hz-u-square hz-u-square-tr" data-pointer="dealTR"></li>
|
||||
<li class="hz-u-square hz-u-square-cl" data-pointer="dealCL"></li>
|
||||
<li class="hz-u-square hz-u-square-cr" data-pointer="dealCR"></li>
|
||||
<li class="hz-u-square hz-u-square-bl" data-pointer="dealBL"></li>
|
||||
<li class="hz-u-square hz-u-square-bc" data-pointer="dealBC"></li>
|
||||
<li class="hz-u-square hz-u-square-br" data-pointer="dealBR"></li>
|
||||
</ul>
|
||||
|
||||
<Modal
|
||||
v-model="showModal"
|
||||
title="编辑热区"
|
||||
draggable
|
||||
scrollable
|
||||
:mask="false"
|
||||
ok-text="保存"
|
||||
@on-ok="saveZone"
|
||||
@on-cancel="cancelZone"
|
||||
>
|
||||
<div>
|
||||
<div class="hz-edit-img">
|
||||
<img class="show-image" :src="zoneForm.img" alt />
|
||||
</div>
|
||||
|
||||
<Form :model="zoneForm" :label-width="80">
|
||||
<!-- <FormItem label="图片链接:">
|
||||
<Input v-model="zoneForm.img"></Input>
|
||||
<Button size="small" type="primary" @click="handleSelectImg"
|
||||
>选择图片</Button
|
||||
>
|
||||
:v-model="zoneForm.type === 'goods' ? zoneForm.goodsName : zoneForm.link"
|
||||
</FormItem> -->
|
||||
<FormItem label="跳转链接:">
|
||||
<Input type="textarea" v-if="zoneForm.type === 'other' && zoneForm.title === '外部链接'" v-model="zoneForm.link" ></Input>
|
||||
<Button size="small" type="primary" @click="handleSelectLink"
|
||||
>选择链接</Button
|
||||
>
|
||||
</FormItem>
|
||||
</Form>
|
||||
</div>
|
||||
</Modal>
|
||||
<!-- 选择商品。链接 -->
|
||||
<liliDialog ref="liliDialog" @selectedLink="selectedLink"></liliDialog>
|
||||
<!-- 选择图片 -->
|
||||
<Modal width="1200px" v-model="picModelFlag" footer-hide>
|
||||
<ossManage
|
||||
@callback="callbackSelected"
|
||||
:isComponent="true"
|
||||
ref="ossManage"
|
||||
/>
|
||||
</Modal>
|
||||
</li>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import changeSize from "../directives/changeSize";
|
||||
import dragItem from "../directives/dragItem";
|
||||
import ossManage from "@/views/sys/oss-manage/ossManage";
|
||||
|
||||
export default {
|
||||
name: "Zone",
|
||||
components: {
|
||||
ossManage,
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
zoneTop: "",
|
||||
zoneLeft: "",
|
||||
zoneWidth: "",
|
||||
zoneHeight: "",
|
||||
hideZone: false,
|
||||
tooSmall: false,
|
||||
showModal: false,
|
||||
picModelFlag: false,
|
||||
currentIndex: 0,
|
||||
currentShowIndex: -1,
|
||||
zoneForm: {
|
||||
img: "",
|
||||
link: "",
|
||||
type: "",
|
||||
},
|
||||
};
|
||||
},
|
||||
props: ["index", "setting"],
|
||||
mounted() {
|
||||
this.setZoneInfo(this.setting);
|
||||
},
|
||||
methods: {
|
||||
setZoneInfo(val) {
|
||||
this.zoneTop = this.getZoneStyle(val.topPer);
|
||||
this.zoneLeft = this.getZoneStyle(val.leftPer);
|
||||
this.zoneWidth = this.getZoneStyle(val.widthPer);
|
||||
this.zoneHeight = this.getZoneStyle(val.heightPer);
|
||||
this.tooSmall = val.widthPer < 0.01 && val.heightPer < 0.01;
|
||||
this.zoneForm.link = val.link;
|
||||
this.settingZone(val);
|
||||
},
|
||||
handlehideZone(isHide = true) {
|
||||
if (this.hideZone === isHide) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.hideZone = isHide;
|
||||
},
|
||||
changeInfo(info = {}) {
|
||||
const { index } = this;
|
||||
|
||||
this.$emit("changeInfo", {
|
||||
info,
|
||||
index,
|
||||
zoneInfo: this.zoneForm,
|
||||
});
|
||||
},
|
||||
showModalFn(index) {
|
||||
this.showModal = true;
|
||||
this.currentIndex = index;
|
||||
},
|
||||
// 选择图片
|
||||
handleSelectImg() {
|
||||
this.$refs.ossManage.selectImage = true;
|
||||
this.picModelFlag = true;
|
||||
},
|
||||
// 选择图片回调
|
||||
callbackSelected(item) {
|
||||
this.picModelFlag = false;
|
||||
this.zoneForm.img = item.url;
|
||||
},
|
||||
|
||||
// 调起选择链接弹窗
|
||||
handleSelectLink(item, index) {
|
||||
if (item) this.selectedNav = item;
|
||||
this.$refs.liliDialog.open("link");
|
||||
},
|
||||
// 已选链接
|
||||
selectedLink(val) {
|
||||
this.zoneForm.link = this.$options.filters.formatLinkType(val);
|
||||
this.settingZone(val);
|
||||
this.changeInfo(this.zoneForm);
|
||||
},
|
||||
settingZone(val) {
|
||||
this.zoneForm.type = val.___type || val.type;
|
||||
this.zoneForm.title = val.title;
|
||||
switch (val.___type) {
|
||||
case "goods":
|
||||
this.zoneForm.id = val.id;
|
||||
this.zoneForm.goodsId = val.goodsId;
|
||||
this.zoneForm.goodsName = val.goodsName;
|
||||
break;
|
||||
case "category":
|
||||
this.zoneForm.id = val.allId;
|
||||
this.zoneForm.name = val.name;
|
||||
break;
|
||||
case "shops":
|
||||
this.zoneForm.id = val.id;
|
||||
this.zoneForm.storeName = val.storeName;
|
||||
break;
|
||||
case "pages":
|
||||
this.zoneForm.id = val.id;
|
||||
this.zoneForm.___path = val.___path;
|
||||
this.zoneForm.title = val.title;
|
||||
break;
|
||||
case "marketing":
|
||||
this.zoneForm.id = val.id;
|
||||
this.zoneForm.goodsId = val.goodsId;
|
||||
this.zoneForm.goodsName = val.goodsName;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
},
|
||||
saveZone() {},
|
||||
cancelZone() {
|
||||
this.showModal = false;
|
||||
},
|
||||
delZone() {
|
||||
this.delItem(this.currentIndex);
|
||||
},
|
||||
delItem(index) {
|
||||
this.$emit("delItem", index);
|
||||
},
|
||||
getZoneStyle(val) {
|
||||
return `${(val || 0) * 100}%`;
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
setting: {
|
||||
handler: function (val) {
|
||||
this.setZoneInfo(val);
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
directives: {
|
||||
changeSize,
|
||||
dragItem,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
101
manager/src/components/hotzone/directives/addItem.js
Normal file
101
manager/src/components/hotzone/directives/addItem.js
Normal file
@@ -0,0 +1,101 @@
|
||||
import _ from '../utils'
|
||||
|
||||
export default {
|
||||
bind: function (el, binding, vnode) {
|
||||
const MIN_LIMIT = _.MIN_LIMIT
|
||||
|
||||
el.addEventListener('mousedown', handleMouseDown, { passive: false })
|
||||
|
||||
function handleMouseDown(e) {
|
||||
// console.log('additem', e)
|
||||
e && e.preventDefault()
|
||||
|
||||
let itemInfo = {
|
||||
top: _.getDistanceY(e, el),
|
||||
left: _.getDistanceX(e, el),
|
||||
width: 0,
|
||||
height: 0
|
||||
}
|
||||
let container = _.getOffset(el)
|
||||
|
||||
// Only used once at the beginning of init
|
||||
let setting = {
|
||||
topPer: _.decimalPoint(itemInfo.top / container.height),
|
||||
leftPer: _.decimalPoint(itemInfo.left / container.width),
|
||||
widthPer: 0,
|
||||
heightPer: 0
|
||||
}
|
||||
let preX = _.getPageX(e)
|
||||
let preY = _.getPageY(e)
|
||||
|
||||
vnode.context.addItem(setting)// 这里去添加并发送了add通知,不应该发送通知
|
||||
|
||||
window.addEventListener('mousemove', handleChange, { passive: false })
|
||||
window.addEventListener('mouseup', handleMouseUp, { passive: false })
|
||||
|
||||
function handleChange(e) {
|
||||
e && e.preventDefault()
|
||||
|
||||
let moveX = _.getPageX(e) - preX
|
||||
let moveY = _.getPageY(e) - preY
|
||||
preX = _.getPageX(e)
|
||||
preY = _.getPageY(e)
|
||||
|
||||
// Not consider the direction of movement first, consider only the lower right drag point
|
||||
let minLimit = 0
|
||||
// 添加热区时,判定鼠标释放时,满足(热区大于48*48时)条件时生效
|
||||
let styleInfo = _.dealBR(itemInfo, moveX, moveY, minLimit)
|
||||
|
||||
// Boundary value processing 改变热区大小时边界条件的处理
|
||||
itemInfo = _.dealEdgeValue(itemInfo, styleInfo, container, vnode.context.zones)
|
||||
|
||||
Object.assign(el.lastElementChild.style, {
|
||||
top: `${itemInfo.top}px`,
|
||||
left: `${itemInfo.left}px`,
|
||||
width: `${itemInfo.width}px`,
|
||||
height: `${itemInfo.height}px`
|
||||
})
|
||||
}
|
||||
|
||||
function handleMouseUp() {
|
||||
let perInfo = {
|
||||
topPer: _.decimalPoint(itemInfo.top / container.height),
|
||||
leftPer: _.decimalPoint(itemInfo.left / container.width),
|
||||
widthPer: _.decimalPoint(itemInfo.width / container.width),
|
||||
heightPer: _.decimalPoint(itemInfo.height / container.height),
|
||||
img: "",
|
||||
link: "",
|
||||
type: "",
|
||||
title: ""
|
||||
}
|
||||
|
||||
if (vnode.context.isOverRange()) {
|
||||
vnode.context.overRange() // 判断超出个数限制,给overRange钩子抛回调
|
||||
} else if (container.height < MIN_LIMIT && itemInfo.width > MIN_LIMIT) {
|
||||
vnode.context.changeItem(Object.assign(perInfo, {
|
||||
topPer: 0,
|
||||
heightPer: 1
|
||||
}), true)
|
||||
} else if (container.width < MIN_LIMIT && itemInfo.height > MIN_LIMIT) {
|
||||
vnode.context.changeItem(Object.assign(perInfo, {
|
||||
leftper: 0,
|
||||
widthPer: 1
|
||||
}), true)
|
||||
} else if (itemInfo.width > MIN_LIMIT && itemInfo.height > MIN_LIMIT) {
|
||||
vnode.context.changeItem(perInfo, true)
|
||||
} else {
|
||||
// 当添加区域超出范围或小于最小区域(48*48)时触发,删除当亲绘制的热区并发送erase事件通知
|
||||
vnode.context.eraseItem()
|
||||
}
|
||||
|
||||
window.removeEventListener('mousemove', handleChange)
|
||||
window.removeEventListener('mouseup', handleMouseUp)
|
||||
}
|
||||
}
|
||||
|
||||
el.$destroy = () => el.removeEventListener('mousedown', handleMouseDown)
|
||||
},
|
||||
unbind: function (el) {
|
||||
el.$destroy()
|
||||
}
|
||||
}
|
||||
91
manager/src/components/hotzone/directives/changeSize.js
Normal file
91
manager/src/components/hotzone/directives/changeSize.js
Normal file
@@ -0,0 +1,91 @@
|
||||
import _ from '../utils'
|
||||
|
||||
export default {
|
||||
bind: function (el, binding, vnode) {
|
||||
el.addEventListener('mousedown', handleMouseDown,{ passive: false })
|
||||
|
||||
function handleMouseDown (e) {
|
||||
let pointer = e.target.dataset.pointer //元素上绑定的方法名
|
||||
|
||||
if (!pointer) {
|
||||
return
|
||||
}
|
||||
|
||||
e && e.stopPropagation()
|
||||
|
||||
let zone = el.parentNode
|
||||
let setting = vnode.context.setting
|
||||
let currentIndex = vnode.context.index
|
||||
let container = _.getOffset(zone.parentNode)
|
||||
let itemInfo = {
|
||||
width: _.getOffset(zone).width || 0,
|
||||
height: _.getOffset(zone).height || 0,
|
||||
top: setting.topPer * container.height || 0,
|
||||
left: setting.leftPer * container.width || 0
|
||||
}
|
||||
let preX = _.getPageX(e)
|
||||
let preY = _.getPageY(e)
|
||||
let flag
|
||||
|
||||
// Hide the info displayed by hover
|
||||
vnode.context.handlehideZone(true)
|
||||
|
||||
window.addEventListener('mousemove', handleChange,{ passive: false })
|
||||
window.addEventListener('mouseup', handleMouseUp,{ passive: false })
|
||||
|
||||
function handleChange (e) {
|
||||
e && e.preventDefault()
|
||||
flag = true
|
||||
|
||||
let moveX = _.getPageX(e) - preX
|
||||
let moveY = _.getPageY(e) - preY
|
||||
|
||||
preX = _.getPageX(e)
|
||||
preY = _.getPageY(e)
|
||||
|
||||
// Handling the situation when different dragging points are selected
|
||||
let styleInfo = _[pointer](itemInfo, moveX, moveY)//调用对应的方法
|
||||
// Boundary value processing
|
||||
itemInfo = _.dealEdgeValue(itemInfo, styleInfo, container, vnode.context.$parent.zones, currentIndex)
|
||||
|
||||
Object.assign(zone.style, {
|
||||
top: `${itemInfo.top}px`,
|
||||
left: `${itemInfo.left}px`,
|
||||
width: `${itemInfo.width}px`,
|
||||
height: `${itemInfo.height}px`
|
||||
})
|
||||
}
|
||||
|
||||
function handleMouseUp () {
|
||||
if (flag) {
|
||||
flag = false
|
||||
let perInfo = {
|
||||
topPer: _.decimalPoint(itemInfo.top / container.height),
|
||||
leftPer: _.decimalPoint(itemInfo.left / container.width),
|
||||
widthPer: _.decimalPoint(itemInfo.width / container.width),
|
||||
heightPer: _.decimalPoint(itemInfo.height / container.height)
|
||||
}
|
||||
vnode.context.changeInfo(perInfo)
|
||||
|
||||
// 兼容数据无变更情况下导致 computed 不更新,数据仍为 px 时 resize 出现的问题
|
||||
Object.assign(zone.style, {
|
||||
top: `${itemInfo.top}px`,
|
||||
left: `${itemInfo.left}px`,
|
||||
width: `${itemInfo.width}px`,
|
||||
height: `${itemInfo.height}px`
|
||||
})
|
||||
}
|
||||
// Show the info
|
||||
vnode.context.handlehideZone(false)
|
||||
|
||||
window.removeEventListener('mousemove', handleChange)
|
||||
window.removeEventListener('mouseup', handleMouseUp)
|
||||
}
|
||||
}
|
||||
|
||||
el.$destroy = () => el.removeEventListener('mousedown', handleMouseDown)
|
||||
},
|
||||
unbind: function (el) {
|
||||
el.$destroy()
|
||||
}
|
||||
}
|
||||
108
manager/src/components/hotzone/directives/dragItem.js
Normal file
108
manager/src/components/hotzone/directives/dragItem.js
Normal file
@@ -0,0 +1,108 @@
|
||||
import _ from '../utils'
|
||||
|
||||
export default {
|
||||
bind: function (el, binding, vnode) {
|
||||
el.addEventListener('mousedown', handleMouseDown)
|
||||
let collision
|
||||
function handleMouseDown (e) {
|
||||
e && e.stopPropagation()
|
||||
let container = _.getOffset(el.parentNode)
|
||||
let preX = _.getPageX(e)
|
||||
let preY = _.getPageY(e)
|
||||
let topPer
|
||||
let leftPer
|
||||
let flag
|
||||
|
||||
window.addEventListener('mousemove', handleChange,{ passive: false })
|
||||
window.addEventListener('mouseup', handleMouseUp,{ passive: false })
|
||||
|
||||
function handleChange (e) {
|
||||
e && e.preventDefault()
|
||||
flag = true
|
||||
collision = false
|
||||
// Hide the info displayed by hover
|
||||
vnode.context.handlehideZone(true)
|
||||
|
||||
let setting = vnode.context.setting
|
||||
let currentIndex = vnode.context.index
|
||||
let moveX = _.getPageX(e) - preX
|
||||
let moveY = _.getPageY(e) - preY
|
||||
|
||||
setting.topPer = setting.topPer || 0
|
||||
setting.leftPer = setting.leftPer || 0
|
||||
topPer = _.decimalPoint(moveY / container.height + setting.topPer)
|
||||
leftPer = _.decimalPoint(moveX / container.width + setting.leftPer)
|
||||
|
||||
// Hotzone moving boundary processing
|
||||
if (topPer < 0) {
|
||||
topPer = 0
|
||||
moveY = -container.height * setting.topPer
|
||||
}
|
||||
|
||||
if (leftPer < 0) {
|
||||
leftPer = 0
|
||||
moveX = -container.width * setting.leftPer
|
||||
}
|
||||
|
||||
if (topPer + setting.heightPer > 1) {
|
||||
topPer = 1 - setting.heightPer
|
||||
moveY = container.height * (topPer - setting.topPer)
|
||||
}
|
||||
|
||||
if (leftPer + setting.widthPer > 1) {
|
||||
leftPer = 1 - setting.widthPer
|
||||
moveX = container.width * (leftPer - setting.leftPer)
|
||||
}
|
||||
// 拖拽碰撞检测
|
||||
if (vnode.context.$parent.zones.length > 1) {
|
||||
let currentzones = JSON.parse(JSON.stringify(vnode.context.$parent.zones)).map((zone) => {
|
||||
return {
|
||||
left: (zone.leftPer || 0) * container.width,
|
||||
top: (zone.topPer || 0) * container.height,
|
||||
width: (zone.widthPer || 0) * container.width,
|
||||
height: (zone.heightPer || 0) * container.height
|
||||
}
|
||||
})
|
||||
// 矫正
|
||||
let changeSetting = {}
|
||||
changeSetting.left = setting.leftPer * container.width + moveX
|
||||
changeSetting.top = setting.topPer * container.height + moveY
|
||||
changeSetting.width = setting.widthPer * container.width
|
||||
changeSetting.height = setting.heightPer * container.height
|
||||
// 碰撞检测
|
||||
for (let i = 0, len = currentzones.length; i < len; i++) {
|
||||
if (currentIndex !== i && _.handleEgdeCollisions(currentzones[i], changeSetting)) {
|
||||
collision = true
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
el.style.transform = `translate(${moveX}px, ${moveY}px)`
|
||||
}
|
||||
|
||||
function handleMouseUp () {
|
||||
if (flag) {
|
||||
flag = false
|
||||
el.style.transform = 'translate(0, 0)'
|
||||
if (!collision) {
|
||||
vnode.context.changeInfo({
|
||||
topPer,
|
||||
leftPer
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// Show the info
|
||||
vnode.context.handlehideZone(false)
|
||||
|
||||
window.removeEventListener('mousemove', handleChange)
|
||||
window.removeEventListener('mouseup', handleMouseUp)
|
||||
}
|
||||
}
|
||||
|
||||
el.$destroy = () => el.removeEventListener('mousedown', handleMouseDown)
|
||||
},
|
||||
unbind: function (el) {
|
||||
el.$destroy()
|
||||
}
|
||||
}
|
||||
7
manager/src/components/hotzone/index.js
Normal file
7
manager/src/components/hotzone/index.js
Normal file
@@ -0,0 +1,7 @@
|
||||
import hotzone from './index.vue'
|
||||
|
||||
hotzone.install = (Vue) => {
|
||||
Vue.component(hotzone.name, hotzone)
|
||||
}
|
||||
|
||||
export default hotzone
|
||||
69
manager/src/components/hotzone/index.vue
Normal file
69
manager/src/components/hotzone/index.vue
Normal file
@@ -0,0 +1,69 @@
|
||||
<template>
|
||||
<Modal
|
||||
:styles="{ top: '120px' }"
|
||||
width="800"
|
||||
@on-cancel="clickClose"
|
||||
@on-ok="clickOK"
|
||||
v-model="flag"
|
||||
:mask-closable="false"
|
||||
title="绘制热区"
|
||||
scrollable
|
||||
>
|
||||
<template v-if="flag">
|
||||
<hotzone
|
||||
ref="hotzone"
|
||||
@change="changeHotzone"
|
||||
:zonesInit="res.zoneInfo"
|
||||
:image="res.img"
|
||||
></hotzone>
|
||||
</template>
|
||||
</Modal>
|
||||
</template>
|
||||
<script>
|
||||
import hotzone from "./components/Hotzone.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
hotzone,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
flag: false, // modal显隐
|
||||
};
|
||||
},
|
||||
props: ["res"],
|
||||
mounted() {},
|
||||
methods: {
|
||||
changeHotzone(info) {
|
||||
this.$emit("changeZone", info);
|
||||
},
|
||||
// 关闭弹窗
|
||||
clickClose() {
|
||||
this.$emit("closeFlag", false);
|
||||
},
|
||||
// 点击确认
|
||||
clickOK() {
|
||||
this.clickClose();
|
||||
},
|
||||
// 打开组件方法
|
||||
open(type, mutiple) {
|
||||
this.flag = true;
|
||||
},
|
||||
// 关闭组件
|
||||
close() {
|
||||
this.flag = false;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
/deep/ .ivu-modal {
|
||||
overflow: hidden;
|
||||
height: 650px !important;
|
||||
}
|
||||
/deep/ .ivu-modal-body {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
274
manager/src/components/hotzone/utils/index.js
Normal file
274
manager/src/components/hotzone/utils/index.js
Normal file
@@ -0,0 +1,274 @@
|
||||
let _ = {
|
||||
MIN_LIMIT: 48, // Min size of zone
|
||||
DECIMAL_PLACES: 4 // Hotzone positioning decimal point limit number of digits
|
||||
}
|
||||
|
||||
/**
|
||||
* Get a power result of 10 for the power of the constant
|
||||
* @return {Number}
|
||||
*/
|
||||
_.getMultiple = (decimalPlaces = _.DECIMAL_PLACES) => {
|
||||
return Math.pow(10, decimalPlaces)
|
||||
}
|
||||
|
||||
/**
|
||||
* Limit decimal places
|
||||
* @param {Number} num
|
||||
* @return {Number}
|
||||
*/
|
||||
_.decimalPoint = (val = 0) => { // 处理js小数点计算不精确问题,先放再缩小
|
||||
return Math.round(val * _.getMultiple()) / _.getMultiple() || 0
|
||||
}
|
||||
|
||||
/**
|
||||
* Get element width and height
|
||||
* @param {Object} elem
|
||||
* @return {Object}
|
||||
*/
|
||||
_.getOffset = (elem = {}) => ({
|
||||
width: elem.clientWidth || 0,
|
||||
height: elem.clientHeight || 0
|
||||
})
|
||||
|
||||
/**
|
||||
* Get pageX
|
||||
* @param {Object} e
|
||||
* @return {Number}
|
||||
*/
|
||||
_.getPageX = (e) => ('pageX' in e) ? e.pageX : e.touches[0].pageX
|
||||
|
||||
/**
|
||||
* Get pageY
|
||||
* @param {Object} e
|
||||
* @return {Number}
|
||||
*/
|
||||
_.getPageY = (e) => ('pageY' in e) ? e.pageY : e.touches[0].pageY
|
||||
|
||||
/**
|
||||
* Gets the abscissa value of the mouse click relative to the target node
|
||||
* @param {Object} e
|
||||
* @param {Object} container
|
||||
* @return {Number}
|
||||
*/
|
||||
_.getDistanceX = (e, container) =>
|
||||
_.getPageX(e) - (container.getBoundingClientRect().left + window.pageXOffset)
|
||||
|
||||
/**
|
||||
* Gets the ordinate value of the mouse click relative to the target node
|
||||
* @param {Object} e
|
||||
* @param {Object} container
|
||||
* @return {Number}
|
||||
*/
|
||||
_.getDistanceY = (e, container) =>
|
||||
_.getPageY(e) - (container.getBoundingClientRect().top + window.pageYOffset)
|
||||
|
||||
// 检测区域是否有碰撞 true 有碰撞交集 ,false 无碰撞
|
||||
_.handleEgdeCollisions = (rect1, rect2) => {
|
||||
const l1 = { left: rect1.left, top: rect1.top }
|
||||
const r1 = { left: rect1.left + rect1.width, top: rect1.top + rect1.height }
|
||||
const l2 = { left: rect2.left, top: rect2.top }
|
||||
const r2 = { left: rect2.left + rect2.width, top: rect2.top + rect2.height }
|
||||
return !(
|
||||
l1.left > r2.left ||
|
||||
l2.left > r1.left ||
|
||||
l1.top > r2.top ||
|
||||
l2.top > r1.top
|
||||
)
|
||||
}
|
||||
/**
|
||||
* Treatment of boundary conditions when changing the size of the hotzone 改变热区大小时边界条件的处理(如果要避免热区重叠,代码要加载这里)
|
||||
* @param {Object} itemInfo
|
||||
* @param {Object} styleInfo
|
||||
* @param {Object} container
|
||||
*/
|
||||
_.dealEdgeValue = (itemInfo, styleInfo, container, zones, currentIndex = zones.length - 1) => {
|
||||
|
||||
if (Object.prototype.hasOwnProperty.call(styleInfo, "left") && styleInfo.left < 0) {
|
||||
styleInfo.left = 0
|
||||
styleInfo.width = itemInfo.width + itemInfo.left
|
||||
}
|
||||
|
||||
if (Object.prototype.hasOwnProperty.call(styleInfo, "top") && styleInfo.top < 0) {
|
||||
styleInfo.top = 0
|
||||
styleInfo.height = itemInfo.height + itemInfo.top
|
||||
}
|
||||
|
||||
if (!Object.prototype.hasOwnProperty.call(styleInfo, "left") && Object.prototype.hasOwnProperty.call(styleInfo, "width")) {
|
||||
if (itemInfo.left + styleInfo.width > container.width) {
|
||||
styleInfo.width = container.width - itemInfo.left
|
||||
}
|
||||
}
|
||||
|
||||
if (!Object.prototype.hasOwnProperty.call(styleInfo, "top") && Object.prototype.hasOwnProperty.call(styleInfo, "height")) {
|
||||
if (itemInfo.top + styleInfo.height > container.height) {
|
||||
styleInfo.height = container.height - itemInfo.top
|
||||
}
|
||||
}
|
||||
// 与其他热区重叠,则修正 检测是否发生碰撞
|
||||
if (zones.length > 1) {
|
||||
let currentzones = JSON.parse(JSON.stringify(zones)).map((zone) => {
|
||||
return {
|
||||
left: (zone.leftPer || 0) * container.width,
|
||||
top: (zone.topPer || 0) * container.height,
|
||||
width: (zone.widthPer || 0) * container.width,
|
||||
height: (zone.heightPer || 0) * container.height
|
||||
}
|
||||
})
|
||||
let current = { ...itemInfo, ...styleInfo }
|
||||
for (let i = 0, len = currentzones.length; i < len; i++) {
|
||||
if (currentIndex !== i && _.handleEgdeCollisions(currentzones[i], current)) {
|
||||
return itemInfo
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return Object.assign(itemInfo, styleInfo)
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle different drag points, capital letters mean: T-top,L-left,C-center,R-right,B-bottom
|
||||
* @param {Object} itemInfo
|
||||
* @param {Number} moveX
|
||||
* @param {Number} moveY
|
||||
* @return {Object}
|
||||
*/
|
||||
_.dealTL = (itemInfo, moveX, moveY, minLimit = _.MIN_LIMIT) => {
|
||||
let styleInfo = {}
|
||||
let width = itemInfo.width - moveX
|
||||
let height = itemInfo.height - moveY
|
||||
|
||||
if (width >= Math.min(minLimit, itemInfo.width)) {
|
||||
Object.assign(styleInfo, {
|
||||
width,
|
||||
left: itemInfo.left + moveX
|
||||
})
|
||||
}
|
||||
|
||||
if (height >= Math.min(minLimit, itemInfo.height)) {
|
||||
Object.assign(styleInfo, {
|
||||
height,
|
||||
top: itemInfo.top + moveY
|
||||
})
|
||||
}
|
||||
|
||||
return styleInfo
|
||||
}
|
||||
|
||||
_.dealTC = (itemInfo, moveX, moveY, minLimit = _.MIN_LIMIT) => {
|
||||
let styleInfo = {}
|
||||
let height = itemInfo.height - moveY
|
||||
|
||||
if (height >= Math.min(minLimit, itemInfo.height)) {
|
||||
styleInfo = {
|
||||
height,
|
||||
top: itemInfo.top + moveY
|
||||
}
|
||||
}
|
||||
|
||||
return styleInfo
|
||||
}
|
||||
|
||||
_.dealTR = (itemInfo, moveX, moveY, minLimit = _.MIN_LIMIT) => {
|
||||
let styleInfo = {}
|
||||
let width = itemInfo.width + moveX
|
||||
let height = itemInfo.height - moveY
|
||||
|
||||
if (width >= Math.min(minLimit, itemInfo.width)) {
|
||||
Object.assign(styleInfo, {
|
||||
width
|
||||
})
|
||||
}
|
||||
|
||||
if (height >= Math.min(minLimit, itemInfo.height)) {
|
||||
Object.assign(styleInfo, {
|
||||
height,
|
||||
top: itemInfo.top + moveY
|
||||
})
|
||||
}
|
||||
|
||||
return styleInfo
|
||||
}
|
||||
|
||||
_.dealCL = (itemInfo, moveX, moveY, minLimit = _.MIN_LIMIT) => {
|
||||
let styleInfo = {}
|
||||
let width = itemInfo.width - moveX
|
||||
|
||||
if (width >= Math.min(minLimit, itemInfo.width)) {
|
||||
Object.assign(styleInfo, {
|
||||
width,
|
||||
left: itemInfo.left + moveX
|
||||
})
|
||||
}
|
||||
|
||||
return styleInfo
|
||||
}
|
||||
|
||||
_.dealCR = (itemInfo, moveX, moveY, minLimit = _.MIN_LIMIT) => {
|
||||
let styleInfo = {}
|
||||
let width = itemInfo.width + moveX
|
||||
|
||||
if (width >= Math.min(minLimit, itemInfo.width)) {
|
||||
Object.assign(styleInfo, {
|
||||
width
|
||||
})
|
||||
}
|
||||
|
||||
return styleInfo
|
||||
}
|
||||
|
||||
_.dealBL = (itemInfo, moveX, moveY, minLimit = _.MIN_LIMIT) => {
|
||||
let styleInfo = {}
|
||||
let width = itemInfo.width - moveX
|
||||
let height = itemInfo.height + moveY
|
||||
|
||||
if (width >= Math.min(minLimit, itemInfo.width)) {
|
||||
Object.assign(styleInfo, {
|
||||
width,
|
||||
left: itemInfo.left + moveX
|
||||
})
|
||||
}
|
||||
|
||||
if (height >= Math.min(minLimit, itemInfo.height)) {
|
||||
Object.assign(styleInfo, {
|
||||
height
|
||||
})
|
||||
}
|
||||
|
||||
return styleInfo
|
||||
}
|
||||
|
||||
_.dealBC = (itemInfo, moveX, moveY, minLimit = _.MIN_LIMIT) => {
|
||||
let styleInfo = {}
|
||||
let height = itemInfo.height + moveY
|
||||
|
||||
if (height >= Math.min(minLimit, itemInfo.height)) {
|
||||
Object.assign(styleInfo, {
|
||||
height
|
||||
})
|
||||
}
|
||||
|
||||
return styleInfo
|
||||
}
|
||||
// 添加热区时,判定鼠标释放点满足一下条件时生效
|
||||
_.dealBR = (itemInfo, moveX, moveY, minLimit = _.MIN_LIMIT) => {
|
||||
let styleInfo = {}
|
||||
let width = itemInfo.width + moveX
|
||||
let height = itemInfo.height + moveY
|
||||
if (width >= Math.min(minLimit, itemInfo.width)) {
|
||||
// 改变后的宽度 >= min(之前宽度,内置的最小宽度标准),即生效
|
||||
Object.assign(styleInfo, {
|
||||
width
|
||||
})
|
||||
}
|
||||
|
||||
if (height >= Math.min(minLimit, itemInfo.height)) {
|
||||
// 改变后的高度 大于等于 Min(最小高度,之前高度)时,生效
|
||||
Object.assign(styleInfo, {
|
||||
height
|
||||
})
|
||||
}
|
||||
|
||||
return styleInfo
|
||||
}
|
||||
|
||||
export default _
|
||||
@@ -4,25 +4,67 @@
|
||||
<div class="query-wrapper">
|
||||
<div class="query-item">
|
||||
<div>搜索范围</div>
|
||||
<Input placeholder="商品名称" @on-clear="goodsData=[]; goodsParams.goodsName=''; goodsParams.pageNumber = 1; getQueryGoodsList()" @on-enter="()=>{goodsData=[];goodsParams.pageNumber =1; getQueryGoodsList();}" icon="ios-search" clearable
|
||||
style="width: 150px" v-model="goodsParams.goodsName" />
|
||||
<Input
|
||||
placeholder="商品名称"
|
||||
@on-clear="
|
||||
goodsData = [];
|
||||
goodsParams.goodsName = '';
|
||||
goodsParams.pageNumber = 1;
|
||||
getQueryGoodsList();
|
||||
"
|
||||
@on-enter="
|
||||
() => {
|
||||
goodsData = [];
|
||||
goodsParams.pageNumber = 1;
|
||||
getQueryGoodsList();
|
||||
}
|
||||
"
|
||||
icon="ios-search"
|
||||
clearable
|
||||
style="width: 150px"
|
||||
v-model="goodsParams.goodsName"
|
||||
/>
|
||||
</div>
|
||||
<div class="query-item">
|
||||
<Cascader v-model="category" placeholder="请选择商品分类" style="width: 250px" :data="skuList"></Cascader>
|
||||
<Cascader
|
||||
v-model="category"
|
||||
placeholder="请选择商品分类"
|
||||
style="width: 250px"
|
||||
:data="skuList"
|
||||
></Cascader>
|
||||
</div>
|
||||
<div class="query-item">
|
||||
<Button type="primary" @click="goodsData=[]; getQueryGoodsList();" icon="ios-search">搜索</Button>
|
||||
<Button
|
||||
type="primary"
|
||||
@click="
|
||||
goodsData = [];
|
||||
getQueryGoodsList();
|
||||
"
|
||||
icon="ios-search"
|
||||
>搜索</Button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div style="positon:retavle;">
|
||||
<Scroll class="wap-content-list" :on-reach-bottom="handleReachBottom" :distance-to-edge="[3,3]">
|
||||
<div class="wap-content-item" :class="{ active: item.selected }" @click="checkedGoods(item, index)" v-for="(item, index) in goodsData" :key="index">
|
||||
<div>
|
||||
<Scroll
|
||||
class="wap-content-list"
|
||||
:on-reach-bottom="handleReachBottom"
|
||||
:distance-to-edge="[3, 3]"
|
||||
>
|
||||
<div
|
||||
class="wap-content-item"
|
||||
:class="{ active: item.selected }"
|
||||
@click="checkedGoods(item, index)"
|
||||
v-for="(item, index) in goodsData"
|
||||
:key="index"
|
||||
>
|
||||
<div>
|
||||
<img :src="item.thumbnail" alt="" />
|
||||
</div>
|
||||
<div class="wap-content-desc">
|
||||
<div class="wap-content-desc-title">{{ item.goodsName }}</div>
|
||||
<div class="wap-sku">{{ item.goodsUnit }}</div>
|
||||
<div class="wap-sku"><Tag :color="item.salesModel === 'RETAIL' ? 'default' : 'geekblue'">{{item.salesModel === "RETAIL" ? "零售型" : "批发型"}}</Tag></div>
|
||||
<div class="wap-content-desc-bottom">
|
||||
<div>¥{{ item.price | unitPrice }}</div>
|
||||
</div>
|
||||
@@ -32,7 +74,6 @@
|
||||
|
||||
<div v-if="empty" class="empty">暂无商品信息</div>
|
||||
</Scroll>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -44,8 +85,9 @@ export default {
|
||||
return {
|
||||
type: "multiple", //单选或者多选 single multiple
|
||||
skuList: [], // 商品sku列表
|
||||
total: 0, // 商品总数
|
||||
goodsParams: { // 商品请求参数
|
||||
total: 0, // 商品总数
|
||||
goodsParams: {
|
||||
// 商品请求参数
|
||||
pageNumber: 1,
|
||||
pageSize: 18,
|
||||
order: "desc",
|
||||
@@ -54,6 +96,7 @@ export default {
|
||||
categoryPath: "",
|
||||
marketEnable: "UPPER",
|
||||
authFlag: "PASS",
|
||||
sort:"createTime"
|
||||
},
|
||||
category: [], // 分类
|
||||
goodsData: [], // 商品数据
|
||||
@@ -64,8 +107,10 @@ export default {
|
||||
props: {
|
||||
selectedWay: {
|
||||
type: Array,
|
||||
default: new Array()
|
||||
}
|
||||
default: function () {
|
||||
return new Array();
|
||||
},
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
category(val) {
|
||||
@@ -76,7 +121,7 @@ export default {
|
||||
this.$emit("selected", this.selectedWay);
|
||||
},
|
||||
deep: true,
|
||||
immediate: true
|
||||
immediate: true,
|
||||
},
|
||||
"goodsParams.categoryPath": {
|
||||
handler: function () {
|
||||
@@ -110,22 +155,21 @@ export default {
|
||||
},
|
||||
// 获取列表方法
|
||||
initGoods(res) {
|
||||
if (res.result.records.length !=0) {
|
||||
if (res.result.records.length != 0) {
|
||||
res.result.records.forEach((item) => {
|
||||
item.selected = false;
|
||||
item.___type = "goods"; //设置为goods让pc wap知道标识
|
||||
this.selectedWay.forEach(e => {
|
||||
this.selectedWay.forEach((e) => {
|
||||
if (e.id && e.id === item.id) {
|
||||
item.selected = true
|
||||
item.selected = true;
|
||||
}
|
||||
})
|
||||
});
|
||||
});
|
||||
/**
|
||||
* 解决数据请求中,滚动栏会一直上下跳动
|
||||
*/
|
||||
this.total = res.result.total;
|
||||
this.goodsData.push(...res.result.records);
|
||||
|
||||
} else {
|
||||
this.empty = true;
|
||||
}
|
||||
@@ -136,12 +180,12 @@ export default {
|
||||
// 商品
|
||||
this.initGoods(res);
|
||||
});
|
||||
if (localStorage.getItem('category')) {
|
||||
this.deepGroup(JSON.parse(localStorage.getItem('category')))
|
||||
if (localStorage.getItem("category")) {
|
||||
this.deepGroup(JSON.parse(localStorage.getItem("category")));
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
this.deepGroup(JSON.parse(localStorage.getItem('category')))
|
||||
},3000)
|
||||
this.deepGroup(JSON.parse(localStorage.getItem("category")));
|
||||
}, 3000);
|
||||
}
|
||||
},
|
||||
|
||||
@@ -201,9 +245,9 @@ export default {
|
||||
this.selectedWay.push(val);
|
||||
} else {
|
||||
val.selected = false;
|
||||
for (let i = 0; i<this.selectedWay.length; i++ ) {
|
||||
if (this.selectedWay[i].id===val.id) {
|
||||
this.selectedWay.splice(i,1)
|
||||
for (let i = 0; i < this.selectedWay.length; i++) {
|
||||
if (this.selectedWay[i].id === val.id) {
|
||||
this.selectedWay.splice(i, 1);
|
||||
break;
|
||||
}
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user