mirror of
https://gitee.com/was666/as-editor.git
synced 2025-04-19 20:16:23 +08:00
feat: v1.0.0
This commit is contained in:
王奥斯
parent
7f831bf205
commit
0909c3e4bc
.eslintrc.js.gitignore.prettierrc.jsREADME.en.mdREADME.mdbabel.config.jspackage-lock.jsonpackage.json
public
script
src
App.vue
api
assets
css
iconfont
demo.cssdemo_index.htmliconfont.cssiconfont.eoticonfont.jsiconfont.jsoniconfont.svgiconfont.ttficonfont.wofficonfont.woff2
images
components
componentscom
auxiliarysegmentation
captiontext
commoditysearch
communitypowder
crowdoperation
custommodule
entertheshop
follow
graphicnavigation
index.jsinvestigate
listswitching
magiccube
notice
onlineservice
personalizedrecommendation
pictureads
placementarea
richtext
storeinformation
storenotecard
suspension
tabBar
videoss
voicer
createTemplate
extension
phoneBottom
rightslider
auxiliarysegmentationstyle
captiontextsstyle
commoditysearchstyle
communitypowderstyle
componenmanagement
crowdoperationstyle
custommodulestyle
decorate
entertheshopstyle
followStyle
graphicnavigationstyle
index.jsinvestigatestyle
listswitchingstyle
magiccubestyle
noticestyle
onlineservicestyle
personalizedrecommendationstyle
pictureadsstyle
richtextstyle
storeinformationstyle
storenotecardstyle
suspensionstyle
tabBarStyle
videostyle
voicerstyle
sliderassembly
uploadCommodity
uploadImg
30
.eslintrc.js
Normal file
30
.eslintrc.js
Normal file
@ -0,0 +1,30 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
browser: true,
|
||||
commonjs: true,
|
||||
node: true,
|
||||
es6: true,
|
||||
},
|
||||
extends: ['plugin:vue/essential', 'eslint:recommended'],
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint',
|
||||
sourceType: 'module',
|
||||
},
|
||||
rules: {
|
||||
'no-console': 'off',
|
||||
'no-debugger': 'off',
|
||||
'@typescript-eslint/no-inferrable-types': 'off',
|
||||
'space-before-function-paren': [0, 'always'], // 函数定义时括号前面要不要有空格
|
||||
'prefer-const': 'off', // 建议使用const
|
||||
'brace-style': ['error', '1tbs'], // 大括号风格要求
|
||||
'@typescript-eslint/no-explicit-any': 'off',
|
||||
'no-useless-constructor': 'off', // 无用的构造函数
|
||||
'no-useless-return': 'off',
|
||||
'no-unreachable': 'off', // 禁止在 return、throw、continue 和 break 语句后出现不可达代码
|
||||
'no-new-object': 'off', // 禁止使用 Object 构造函数
|
||||
'no-prototype-builtins': 'off',
|
||||
'vue/no-mutating-props': 'off'
|
||||
},
|
||||
parser: 'vue-eslint-parser',
|
||||
}
|
||||
37
.gitignore
vendored
37
.gitignore
vendored
@ -1,18 +1,25 @@
|
||||
# Build and Release Folders
|
||||
bin-debug/
|
||||
bin-release/
|
||||
[Oo]bj/
|
||||
[Bb]in/
|
||||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
/fire
|
||||
AS-Editor
|
||||
|
||||
# Other files and folders
|
||||
.settings/
|
||||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Executables
|
||||
*.swf
|
||||
*.air
|
||||
*.ipa
|
||||
*.apk
|
||||
# Log files
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
# Project files, i.e. `.project`, `.actionScriptProperties` and `.flexProperties`
|
||||
# should NOT be excluded as they contain compiler settings and other important
|
||||
# information for Eclipse / Flash Builder.
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
*.rar
|
||||
*.zip
|
||||
|
||||
10
.prettierrc.js
Normal file
10
.prettierrc.js
Normal file
@ -0,0 +1,10 @@
|
||||
module.exports = {
|
||||
endOfLine: 'auto',
|
||||
jsxSingleQuote: true,
|
||||
packageManager: 'yarn',
|
||||
useTabs: false,
|
||||
printWidth: 80,
|
||||
tabWidth: 2,
|
||||
semi: false,
|
||||
singleQuote: true,
|
||||
}
|
||||
36
README.en.md
Normal file
36
README.en.md
Normal file
@ -0,0 +1,36 @@
|
||||
# AS-Editor
|
||||
|
||||
#### Description
|
||||
saas店铺后台管理
|
||||
|
||||
#### Software Architecture
|
||||
Software architecture description
|
||||
|
||||
#### Installation
|
||||
|
||||
1. xxxx
|
||||
2. xxxx
|
||||
3. xxxx
|
||||
|
||||
#### Instructions
|
||||
|
||||
1. xxxx
|
||||
2. xxxx
|
||||
3. xxxx
|
||||
|
||||
#### Contribution
|
||||
|
||||
1. Fork the repository
|
||||
2. Create Feat_xxx branch
|
||||
3. Commit your code
|
||||
4. Create Pull Request
|
||||
|
||||
|
||||
#### Gitee Feature
|
||||
|
||||
1. You can use Readme\_XXX.md to support different languages, such as Readme\_en.md, Readme\_zh.md
|
||||
2. Gitee blog [blog.gitee.com](https://blog.gitee.com)
|
||||
3. Explore open source project [https://gitee.com/explore](https://gitee.com/explore)
|
||||
4. The most valuable open source project [GVP](https://gitee.com/gvp)
|
||||
5. The manual of Gitee [https://gitee.com/help](https://gitee.com/help)
|
||||
6. The most popular members [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
|
||||
52
README.md
Normal file
52
README.md
Normal file
@ -0,0 +1,52 @@
|
||||
# AS-Editor
|
||||
|
||||
#### 介绍
|
||||
saas店铺后台管理
|
||||
|
||||
#### 软件架构
|
||||
软件架构说明
|
||||
|
||||
|
||||
#### 安装教程
|
||||
|
||||
1. npm install （安装node_modules模块）
|
||||
2. yarn upgrade (用于更新包到基于规范范围的最新版本)
|
||||
3. npm run serve （运行）
|
||||
4. npm run build （打包）
|
||||
|
||||
#### 使用说明
|
||||
|
||||
> 自定义组件可以看
|
||||
src\layout\home\index.vue （页面）
|
||||
src\components\sliderassembly\index.vue （左侧组件大全）
|
||||
src\utils\componentProperties.js （组件数据）
|
||||
|
||||
#### componentProperties（组件数据）字段注解
|
||||
|
||||
```json
|
||||
{
|
||||
component: 'custommodule', //中间部分手机组件的name
|
||||
text: '自定义模块',
|
||||
type: '1-14', // data-tpye
|
||||
active: true, // 是否选中
|
||||
style: 'custommodulestyle', //右边组件设置的name
|
||||
setStyle: {} // 组件动态数据
|
||||
}
|
||||
```
|
||||
|
||||
#### 参与贡献
|
||||
|
||||
1. Fork 本仓库
|
||||
2. 新建 Feat_xxx 分支
|
||||
3. 提交代码
|
||||
4. 新建 Pull Request
|
||||
|
||||
|
||||
#### 特技
|
||||
|
||||
1. 使用 Readme\_XXX.md 来支持不同的语言，例如 Readme\_en.md, Readme\_zh.md
|
||||
2. Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
|
||||
3. 你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
|
||||
4. [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目，是综合评定出的优秀开源项目
|
||||
5. Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
|
||||
6. Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)
|
||||
5
babel.config.js
Normal file
5
babel.config.js
Normal file
@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
'@vue/cli-plugin-babel/preset'
|
||||
]
|
||||
}
|
||||
13352
package-lock.json
generated
Normal file
13352
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
59
package.json
Normal file
59
package.json
Normal file
@ -0,0 +1,59 @@
|
||||
{
|
||||
"name": "saas",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build",
|
||||
"lint": "eslint --ext .js,.vue src"
|
||||
},
|
||||
"dependencies": {
|
||||
"@tinymce/tinymce-vue": "^3.2.0",
|
||||
"axios": "^0.19.2",
|
||||
"clipboard": "^2.0.6",
|
||||
"core-js": "^3.6.4",
|
||||
"element-ui": "^2.13.0",
|
||||
"html2canvas": "1.0.0-alpha.9",
|
||||
"nprogress": "^0.2.0",
|
||||
"qrcode": "^1.4.4",
|
||||
"qs": "^6.9.1",
|
||||
"tinymce": "^5.2.0",
|
||||
"vant": "^2.5.5",
|
||||
"vue": "^2.6.11",
|
||||
"vue-router": "^3.1.5",
|
||||
"vuedraggable": "^2.23.2",
|
||||
"vuex": "^3.1.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "^4.2.0",
|
||||
"@vue/cli-plugin-router": "^4.2.0",
|
||||
"@vue/cli-plugin-vuex": "^4.2.0",
|
||||
"@vue/cli-service": "^4.2.0",
|
||||
"@vue/eslint-config-prettier": "^6.0.0",
|
||||
"@vue/eslint-config-standard": "^5.1.2",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"eslint": "^7.18.0",
|
||||
"eslint-plugin-import": "^2.20.2",
|
||||
"eslint-plugin-node": "^11.1.0",
|
||||
"eslint-plugin-prettier": "^3.1.4",
|
||||
"eslint-plugin-promise": "^4.2.1",
|
||||
"eslint-plugin-standard": "^4.0.0",
|
||||
"eslint-plugin-vue": "^6.2.2",
|
||||
"husky": "^4.3.8",
|
||||
"less": "^3.0.4",
|
||||
"less-loader": "^5.0.0",
|
||||
"prettier": "^2.2.1",
|
||||
"swiper": "^5.3.6",
|
||||
"vue-template-compiler": "^2.6.11"
|
||||
},
|
||||
"husky": {
|
||||
"hooks": {
|
||||
"pre-commit": "npm run lint",
|
||||
"commit-msg": "node script/verify-commit.js"
|
||||
}
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions"
|
||||
]
|
||||
}
|
||||
4
public/config/config.js
Normal file
4
public/config/config.js
Normal file
@ -0,0 +1,4 @@
|
||||
window.global_config = {
|
||||
BASE_URL: '/api',
|
||||
NODE_ENV: 'prd',
|
||||
}
|
||||
BIN
public/favicon.ico
Normal file
BIN
public/favicon.ico
Normal file
Binary file not shown.
|
After Width: 32px | Height: 32px | Size: 4.2 KiB |
21
public/index.html
Normal file
21
public/index.html
Normal file
@ -0,0 +1,21 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
<script src="./config/config.js"></script>
|
||||
<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
||||
</noscript>
|
||||
<div id="app">
|
||||
|
||||
</div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
||||
389
public/langs/zh_CN.js
Normal file
389
public/langs/zh_CN.js
Normal file
@ -0,0 +1,389 @@
|
||||
tinymce.addI18n('zh_CN',{
|
||||
"Redo": "\u91cd\u505a",
|
||||
"Undo": "\u64a4\u9500",
|
||||
"Cut": "\u526a\u5207",
|
||||
"Copy": "\u590d\u5236",
|
||||
"Paste": "\u7c98\u8d34",
|
||||
"Select all": "\u5168\u9009",
|
||||
"New document": "\u65b0\u6587\u4ef6",
|
||||
"Ok": "\u786e\u5b9a",
|
||||
"Cancel": "\u53d6\u6d88",
|
||||
"Visual aids": "\u7f51\u683c\u7ebf",
|
||||
"Bold": "\u7c97\u4f53",
|
||||
"Italic": "\u659c\u4f53",
|
||||
"Underline": "\u4e0b\u5212\u7ebf",
|
||||
"Strikethrough": "\u5220\u9664\u7ebf",
|
||||
"Superscript": "\u4e0a\u6807",
|
||||
"Subscript": "\u4e0b\u6807",
|
||||
"Clear formatting": "\u6e05\u9664\u683c\u5f0f",
|
||||
"Align left": "\u5de6\u8fb9\u5bf9\u9f50",
|
||||
"Align center": "\u4e2d\u95f4\u5bf9\u9f50",
|
||||
"Align right": "\u53f3\u8fb9\u5bf9\u9f50",
|
||||
"Justify": "\u4e24\u7aef\u5bf9\u9f50",
|
||||
"Bullet list": "\u9879\u76ee\u7b26\u53f7",
|
||||
"Numbered list": "\u7f16\u53f7\u5217\u8868",
|
||||
"Decrease indent": "\u51cf\u5c11\u7f29\u8fdb",
|
||||
"Increase indent": "\u589e\u52a0\u7f29\u8fdb",
|
||||
"Close": "\u5173\u95ed",
|
||||
"Formats": "\u683c\u5f0f",
|
||||
"Your browser doesn't support direct access to the clipboard. Please use the Ctrl+X\/C\/V keyboard shortcuts instead.": "\u4f60\u7684\u6d4f\u89c8\u5668\u4e0d\u652f\u6301\u6253\u5f00\u526a\u8d34\u677f\uff0c\u8bf7\u4f7f\u7528Ctrl+X\/C\/V\u7b49\u5feb\u6377\u952e\u3002",
|
||||
"Headers": "\u6807\u9898",
|
||||
"Header 1": "\u6807\u98981",
|
||||
"Header 2": "\u6807\u98982",
|
||||
"Header 3": "\u6807\u98983",
|
||||
"Header 4": "\u6807\u98984",
|
||||
"Header 5": "\u6807\u98985",
|
||||
"Header 6": "\u6807\u98986",
|
||||
"Headings": "\u6807\u9898",
|
||||
"Heading 1": "\u6807\u98981",
|
||||
"Heading 2": "\u6807\u98982",
|
||||
"Heading 3": "\u6807\u98983",
|
||||
"Heading 4": "\u6807\u98984",
|
||||
"Heading 5": "\u6807\u98985",
|
||||
"Heading 6": "\u6807\u98986",
|
||||
"Preformatted": "\u9884\u5148\u683c\u5f0f\u5316\u7684",
|
||||
"Div": "Div",
|
||||
"Pre": "Pre",
|
||||
"Code": "\u4ee3\u7801",
|
||||
"Paragraph": "\u6bb5\u843d",
|
||||
"Blockquote": "\u5f15\u6587\u533a\u5757",
|
||||
"Inline": "\u6587\u672c",
|
||||
"Blocks": "\u57fa\u5757",
|
||||
"Paste is now in plain text mode. Contents will now be pasted as plain text until you toggle this option off.": "\u5f53\u524d\u4e3a\u7eaf\u6587\u672c\u7c98\u8d34\u6a21\u5f0f\uff0c\u518d\u6b21\u70b9\u51fb\u53ef\u4ee5\u56de\u5230\u666e\u901a\u7c98\u8d34\u6a21\u5f0f\u3002",
|
||||
"Fonts": "\u5b57\u4f53",
|
||||
"Font Sizes": "\u5b57\u53f7",
|
||||
"Class": "\u7c7b\u578b",
|
||||
"Browse for an image": "\u6d4f\u89c8\u56fe\u50cf",
|
||||
"OR": "\u6216",
|
||||
"Drop an image here": "\u62d6\u653e\u4e00\u5f20\u56fe\u50cf\u81f3\u6b64",
|
||||
"Upload": "\u4e0a\u4f20",
|
||||
"Block": "\u5757",
|
||||
"Align": "\u5bf9\u9f50",
|
||||
"Default": "\u9ed8\u8ba4",
|
||||
"Circle": "\u7a7a\u5fc3\u5706",
|
||||
"Disc": "\u5b9e\u5fc3\u5706",
|
||||
"Square": "\u65b9\u5757",
|
||||
"Lower Alpha": "\u5c0f\u5199\u82f1\u6587\u5b57\u6bcd",
|
||||
"Lower Greek": "\u5c0f\u5199\u5e0c\u814a\u5b57\u6bcd",
|
||||
"Lower Roman": "\u5c0f\u5199\u7f57\u9a6c\u5b57\u6bcd",
|
||||
"Upper Alpha": "\u5927\u5199\u82f1\u6587\u5b57\u6bcd",
|
||||
"Upper Roman": "\u5927\u5199\u7f57\u9a6c\u5b57\u6bcd",
|
||||
"Anchor...": "\u951a\u70b9...",
|
||||
"Name": "\u540d\u79f0",
|
||||
"Id": "\u6807\u8bc6\u7b26",
|
||||
"Id should start with a letter, followed only by letters, numbers, dashes, dots, colons or underscores.": "\u6807\u8bc6\u7b26\u5e94\u8be5\u4ee5\u5b57\u6bcd\u5f00\u5934\uff0c\u540e\u8ddf\u5b57\u6bcd\u3001\u6570\u5b57\u3001\u7834\u6298\u53f7\u3001\u70b9\u3001\u5192\u53f7\u6216\u4e0b\u5212\u7ebf\u3002",
|
||||
"You have unsaved changes are you sure you want to navigate away?": "\u4f60\u8fd8\u6709\u6587\u6863\u5c1a\u672a\u4fdd\u5b58\uff0c\u786e\u5b9a\u8981\u79bb\u5f00\uff1f",
|
||||
"Restore last draft": "\u6062\u590d\u4e0a\u6b21\u7684\u8349\u7a3f",
|
||||
"Special characters...": "\u7279\u6b8a\u5b57\u7b26...",
|
||||
"Source code": "\u6e90\u4ee3\u7801",
|
||||
"Insert\/Edit code sample": "\u63d2\u5165\/\u7f16\u8f91\u4ee3\u7801\u793a\u4f8b",
|
||||
"Language": "\u8bed\u8a00",
|
||||
"Code sample...": "\u793a\u4f8b\u4ee3\u7801...",
|
||||
"Color Picker": "\u9009\u8272\u5668",
|
||||
"R": "R",
|
||||
"G": "G",
|
||||
"B": "B",
|
||||
"Left to right": "\u4ece\u5de6\u5230\u53f3",
|
||||
"Right to left": "\u4ece\u53f3\u5230\u5de6",
|
||||
"Emoticons...": "\u8868\u60c5\u7b26\u53f7...",
|
||||
"Metadata and Document Properties": "\u5143\u6570\u636e\u548c\u6587\u6863\u5c5e\u6027",
|
||||
"Title": "\u6807\u9898",
|
||||
"Keywords": "\u5173\u952e\u8bcd",
|
||||
"Description": "\u63cf\u8ff0",
|
||||
"Robots": "\u673a\u5668\u4eba",
|
||||
"Author": "\u4f5c\u8005",
|
||||
"Encoding": "\u7f16\u7801",
|
||||
"Fullscreen": "\u5168\u5c4f",
|
||||
"Action": "\u64cd\u4f5c",
|
||||
"Shortcut": "\u5feb\u6377\u952e",
|
||||
"Help": "\u5e2e\u52a9",
|
||||
"Address": "\u5730\u5740",
|
||||
"Focus to menubar": "\u79fb\u52a8\u7126\u70b9\u5230\u83dc\u5355\u680f",
|
||||
"Focus to toolbar": "\u79fb\u52a8\u7126\u70b9\u5230\u5de5\u5177\u680f",
|
||||
"Focus to element path": "\u79fb\u52a8\u7126\u70b9\u5230\u5143\u7d20\u8def\u5f84",
|
||||
"Focus to contextual toolbar": "\u79fb\u52a8\u7126\u70b9\u5230\u4e0a\u4e0b\u6587\u83dc\u5355",
|
||||
"Insert link (if link plugin activated)": "\u63d2\u5165\u94fe\u63a5 (\u5982\u679c\u94fe\u63a5\u63d2\u4ef6\u5df2\u6fc0\u6d3b)",
|
||||
"Save (if save plugin activated)": "\u4fdd\u5b58(\u5982\u679c\u4fdd\u5b58\u63d2\u4ef6\u5df2\u6fc0\u6d3b)",
|
||||
"Find (if searchreplace plugin activated)": "\u67e5\u627e(\u5982\u679c\u67e5\u627e\u66ff\u6362\u63d2\u4ef6\u5df2\u6fc0\u6d3b)",
|
||||
"Plugins installed ({0}):": "\u5df2\u5b89\u88c5\u63d2\u4ef6 ({0}):",
|
||||
"Premium plugins:": "\u4f18\u79c0\u63d2\u4ef6\uff1a",
|
||||
"Learn more...": "\u4e86\u89e3\u66f4\u591a...",
|
||||
"You are using {0}": "\u4f60\u6b63\u5728\u4f7f\u7528 {0}",
|
||||
"Plugins": "\u63d2\u4ef6",
|
||||
"Handy Shortcuts": "\u5feb\u6377\u952e",
|
||||
"Horizontal line": "\u6c34\u5e73\u5206\u5272\u7ebf",
|
||||
"Insert\/edit image": "\u63d2\u5165\/\u7f16\u8f91\u56fe\u7247",
|
||||
"Image description": "\u56fe\u7247\u63cf\u8ff0",
|
||||
"Source": "\u5730\u5740",
|
||||
"Dimensions": "\u5927\u5c0f",
|
||||
"Constrain proportions": "\u4fdd\u6301\u7eb5\u6a2a\u6bd4",
|
||||
"General": "\u666e\u901a",
|
||||
"Advanced": "\u9ad8\u7ea7",
|
||||
"Style": "\u6837\u5f0f",
|
||||
"Vertical space": "\u5782\u76f4\u8fb9\u8ddd",
|
||||
"Horizontal space": "\u6c34\u5e73\u8fb9\u8ddd",
|
||||
"Border": "\u8fb9\u6846",
|
||||
"Insert image": "\u63d2\u5165\u56fe\u7247",
|
||||
"Image...": "\u56fe\u7247...",
|
||||
"Image list": "\u56fe\u7247\u5217\u8868",
|
||||
"Rotate counterclockwise": "\u9006\u65f6\u9488\u65cb\u8f6c",
|
||||
"Rotate clockwise": "\u987a\u65f6\u9488\u65cb\u8f6c",
|
||||
"Flip vertically": "\u5782\u76f4\u7ffb\u8f6c",
|
||||
"Flip horizontally": "\u6c34\u5e73\u7ffb\u8f6c",
|
||||
"Edit image": "\u7f16\u8f91\u56fe\u7247",
|
||||
"Image options": "\u56fe\u7247\u9009\u9879",
|
||||
"Zoom in": "\u653e\u5927",
|
||||
"Zoom out": "\u7f29\u5c0f",
|
||||
"Crop": "\u88c1\u526a",
|
||||
"Resize": "\u8c03\u6574\u5927\u5c0f",
|
||||
"Orientation": "\u65b9\u5411",
|
||||
"Brightness": "\u4eae\u5ea6",
|
||||
"Sharpen": "\u9510\u5316",
|
||||
"Contrast": "\u5bf9\u6bd4\u5ea6",
|
||||
"Color levels": "\u989c\u8272\u5c42\u6b21",
|
||||
"Gamma": "\u4f3d\u9a6c\u503c",
|
||||
"Invert": "\u53cd\u8f6c",
|
||||
"Apply": "\u5e94\u7528",
|
||||
"Back": "\u540e\u9000",
|
||||
"Insert date\/time": "\u63d2\u5165\u65e5\u671f\/\u65f6\u95f4",
|
||||
"Date\/time": "\u65e5\u671f\/\u65f6\u95f4",
|
||||
"Insert\/Edit Link": "\u63d2\u5165\/\u7f16\u8f91\u94fe\u63a5",
|
||||
"Insert\/edit link": "\u63d2\u5165\/\u7f16\u8f91\u94fe\u63a5",
|
||||
"Text to display": "\u663e\u793a\u6587\u5b57",
|
||||
"Url": "\u5730\u5740",
|
||||
"Open link in...": "\u94fe\u63a5\u6253\u5f00\u4f4d\u7f6e...",
|
||||
"Current window": "\u5f53\u524d\u7a97\u53e3",
|
||||
"None": "\u65e0",
|
||||
"New window": "\u5728\u65b0\u7a97\u53e3\u6253\u5f00",
|
||||
"Remove link": "\u5220\u9664\u94fe\u63a5",
|
||||
"Anchors": "\u951a\u70b9",
|
||||
"Link...": "\u94fe\u63a5...",
|
||||
"Paste or type a link": "\u7c98\u8d34\u6216\u8f93\u5165\u94fe\u63a5",
|
||||
"The URL you entered seems to be an email address. Do you want to add the required mailto: prefix?": "\u4f60\u6240\u586b\u5199\u7684URL\u5730\u5740\u4e3a\u90ae\u4ef6\u5730\u5740\uff0c\u9700\u8981\u52a0\u4e0amailto:\u524d\u7f00\u5417\uff1f",
|
||||
"The URL you entered seems to be an external link. Do you want to add the required http:\/\/ prefix?": "\u4f60\u6240\u586b\u5199\u7684URL\u5730\u5740\u5c5e\u4e8e\u5916\u90e8\u94fe\u63a5\uff0c\u9700\u8981\u52a0\u4e0ahttp:\/\/:\u524d\u7f00\u5417\uff1f",
|
||||
"Link list": "\u94fe\u63a5\u5217\u8868",
|
||||
"Insert video": "\u63d2\u5165\u89c6\u9891",
|
||||
"Insert\/edit video": "\u63d2\u5165\/\u7f16\u8f91\u89c6\u9891",
|
||||
"Insert\/edit media": "\u63d2\u5165\/\u7f16\u8f91\u5a92\u4f53",
|
||||
"Alternative source": "\u955c\u50cf",
|
||||
"Alternative source URL": "\u66ff\u4ee3\u6765\u6e90\u7f51\u5740",
|
||||
"Media poster (Image URL)": "\u5c01\u9762(\u56fe\u7247\u5730\u5740)",
|
||||
"Paste your embed code below:": "\u5c06\u5185\u5d4c\u4ee3\u7801\u7c98\u8d34\u5728\u4e0b\u9762:",
|
||||
"Embed": "\u5185\u5d4c",
|
||||
"Media...": "\u591a\u5a92\u4f53...",
|
||||
"Nonbreaking space": "\u4e0d\u95f4\u65ad\u7a7a\u683c",
|
||||
"Page break": "\u5206\u9875\u7b26",
|
||||
"Paste as text": "\u7c98\u8d34\u4e3a\u6587\u672c",
|
||||
"Preview": "\u9884\u89c8",
|
||||
"Print...": "\u6253\u5370...",
|
||||
"Save": "\u4fdd\u5b58",
|
||||
"Find": "\u67e5\u627e",
|
||||
"Replace with": "\u66ff\u6362\u4e3a",
|
||||
"Replace": "\u66ff\u6362",
|
||||
"Replace all": "\u5168\u90e8\u66ff\u6362",
|
||||
"Previous": "\u4e0a\u4e00\u4e2a",
|
||||
"Next": "\u4e0b\u4e00\u4e2a",
|
||||
"Find and replace...": "\u67e5\u627e\u5e76\u66ff\u6362...",
|
||||
"Could not find the specified string.": "\u672a\u627e\u5230\u641c\u7d22\u5185\u5bb9.",
|
||||
"Match case": "\u533a\u5206\u5927\u5c0f\u5199",
|
||||
"Find whole words only": "\u5168\u5b57\u5339\u914d",
|
||||
"Spell check": "\u62fc\u5199\u68c0\u67e5",
|
||||
"Ignore": "\u5ffd\u7565",
|
||||
"Ignore all": "\u5168\u90e8\u5ffd\u7565",
|
||||
"Finish": "\u5b8c\u6210",
|
||||
"Add to Dictionary": "\u6dfb\u52a0\u5230\u5b57\u5178",
|
||||
"Insert table": "\u63d2\u5165\u8868\u683c",
|
||||
"Table properties": "\u8868\u683c\u5c5e\u6027",
|
||||
"Delete table": "\u5220\u9664\u8868\u683c",
|
||||
"Cell": "\u5355\u5143\u683c",
|
||||
"Row": "\u884c",
|
||||
"Column": "\u5217",
|
||||
"Cell properties": "\u5355\u5143\u683c\u5c5e\u6027",
|
||||
"Merge cells": "\u5408\u5e76\u5355\u5143\u683c",
|
||||
"Split cell": "\u62c6\u5206\u5355\u5143\u683c",
|
||||
"Insert row before": "\u5728\u4e0a\u65b9\u63d2\u5165",
|
||||
"Insert row after": "\u5728\u4e0b\u65b9\u63d2\u5165",
|
||||
"Delete row": "\u5220\u9664\u884c",
|
||||
"Row properties": "\u884c\u5c5e\u6027",
|
||||
"Cut row": "\u526a\u5207\u884c",
|
||||
"Copy row": "\u590d\u5236\u884c",
|
||||
"Paste row before": "\u7c98\u8d34\u5230\u4e0a\u65b9",
|
||||
"Paste row after": "\u7c98\u8d34\u5230\u4e0b\u65b9",
|
||||
"Insert column before": "\u5728\u5de6\u4fa7\u63d2\u5165",
|
||||
"Insert column after": "\u5728\u53f3\u4fa7\u63d2\u5165",
|
||||
"Delete column": "\u5220\u9664\u5217",
|
||||
"Cols": "\u5217",
|
||||
"Rows": "\u884c",
|
||||
"Width": "\u5bbd",
|
||||
"Height": "\u9ad8",
|
||||
"Cell spacing": "\u5355\u5143\u683c\u5916\u95f4\u8ddd",
|
||||
"Cell padding": "\u5355\u5143\u683c\u5185\u8fb9\u8ddd",
|
||||
"Show caption": "\u663e\u793a\u6807\u9898",
|
||||
"Left": "\u5de6\u5bf9\u9f50",
|
||||
"Center": "\u5c45\u4e2d",
|
||||
"Right": "\u53f3\u5bf9\u9f50",
|
||||
"Cell type": "\u5355\u5143\u683c\u7c7b\u578b",
|
||||
"Scope": "\u8303\u56f4",
|
||||
"Alignment": "\u5bf9\u9f50\u65b9\u5f0f",
|
||||
"H Align": "\u6c34\u5e73\u5bf9\u9f50",
|
||||
"V Align": "\u5782\u76f4\u5bf9\u9f50",
|
||||
"Top": "\u9876\u90e8\u5bf9\u9f50",
|
||||
"Middle": "\u5782\u76f4\u5c45\u4e2d",
|
||||
"Bottom": "\u5e95\u90e8\u5bf9\u9f50",
|
||||
"Header cell": "\u8868\u5934\u5355\u5143\u683c",
|
||||
"Row group": "\u884c\u7ec4",
|
||||
"Column group": "\u5217\u7ec4",
|
||||
"Row type": "\u884c\u7c7b\u578b",
|
||||
"Header": "\u8868\u5934",
|
||||
"Body": "\u8868\u4f53",
|
||||
"Footer": "\u8868\u5c3e",
|
||||
"Border color": "\u8fb9\u6846\u989c\u8272",
|
||||
"Insert template...": "\u63d2\u5165\u6a21\u677f...",
|
||||
"Templates": "\u6a21\u677f",
|
||||
"Template": "\u6a21\u677f",
|
||||
"Text color": "\u6587\u5b57\u989c\u8272",
|
||||
"Background color": "\u80cc\u666f\u8272",
|
||||
"Custom...": "\u81ea\u5b9a\u4e49...",
|
||||
"Custom color": "\u81ea\u5b9a\u4e49\u989c\u8272",
|
||||
"No color": "\u65e0",
|
||||
"Remove color": "\u79fb\u9664\u989c\u8272",
|
||||
"Table of Contents": "\u5185\u5bb9\u5217\u8868",
|
||||
"Show blocks": "\u663e\u793a\u533a\u5757\u8fb9\u6846",
|
||||
"Show invisible characters": "\u663e\u793a\u4e0d\u53ef\u89c1\u5b57\u7b26",
|
||||
"Word count": "\u5b57\u6570",
|
||||
"Words: {0}": "\u5b57\u6570\uff1a{0}",
|
||||
"{0} words": "{0} \u5b57",
|
||||
"File": "\u6587\u4ef6",
|
||||
"Edit": "\u7f16\u8f91",
|
||||
"Insert": "\u63d2\u5165",
|
||||
"View": "\u89c6\u56fe",
|
||||
"Format": "\u683c\u5f0f",
|
||||
"Table": "\u8868\u683c",
|
||||
"Tools": "\u5de5\u5177",
|
||||
"Powered by {0}": "\u7531{0}\u9a71\u52a8",
|
||||
"Rich Text Area. Press ALT-F9 for menu. Press ALT-F10 for toolbar. Press ALT-0 for help": "\u5728\u7f16\u8f91\u533a\u6309ALT-F9\u6253\u5f00\u83dc\u5355\uff0c\u6309ALT-F10\u6253\u5f00\u5de5\u5177\u680f\uff0c\u6309ALT-0\u67e5\u770b\u5e2e\u52a9",
|
||||
"Image title": "\u56fe\u7247\u6807\u9898",
|
||||
"Border width": "\u8fb9\u6846\u5bbd\u5ea6",
|
||||
"Border style": "\u8fb9\u6846\u6837\u5f0f",
|
||||
"Error": "\u9519\u8bef",
|
||||
"Warn": "\u8b66\u544a",
|
||||
"Valid": "\u6709\u6548",
|
||||
"To open the popup, press Shift+Enter": "\u6309Shitf+Enter\u952e\u6253\u5f00\u5bf9\u8bdd\u6846",
|
||||
"Rich Text Area. Press ALT-0 for help.": "\u7f16\u8f91\u533a\u3002\u6309Alt+0\u952e\u6253\u5f00\u5e2e\u52a9\u3002",
|
||||
"System Font": "\u7cfb\u7edf\u5b57\u4f53",
|
||||
"Failed to upload image: {0}": "\u56fe\u7247\u4e0a\u4f20\u5931\u8d25: {0}",
|
||||
"Failed to load plugin: {0} from url {1}": "\u63d2\u4ef6\u52a0\u8f7d\u5931\u8d25: {0} \u6765\u81ea\u94fe\u63a5 {1}",
|
||||
"Failed to load plugin url: {0}": "\u63d2\u4ef6\u52a0\u8f7d\u5931\u8d25 \u94fe\u63a5: {0}",
|
||||
"Failed to initialize plugin: {0}": "\u63d2\u4ef6\u521d\u59cb\u5316\u5931\u8d25: {0}",
|
||||
"example": "\u793a\u4f8b",
|
||||
"Search": "\u641c\u7d22",
|
||||
"All": "\u5168\u90e8",
|
||||
"Currency": "\u8d27\u5e01",
|
||||
"Text": "\u6587\u5b57",
|
||||
"Quotations": "\u5f15\u7528",
|
||||
"Mathematical": "\u6570\u5b66",
|
||||
"Extended Latin": "\u62c9\u4e01\u8bed\u6269\u5145",
|
||||
"Symbols": "\u7b26\u53f7",
|
||||
"Arrows": "\u7bad\u5934",
|
||||
"User Defined": "\u81ea\u5b9a\u4e49",
|
||||
"dollar sign": "\u7f8e\u5143\u7b26\u53f7",
|
||||
"currency sign": "\u8d27\u5e01\u7b26\u53f7",
|
||||
"euro-currency sign": "\u6b27\u5143\u7b26\u53f7",
|
||||
"colon sign": "\u5192\u53f7",
|
||||
"cruzeiro sign": "\u514b\u9c81\u8d5b\u7f57\u5e01\u7b26\u53f7",
|
||||
"french franc sign": "\u6cd5\u90ce\u7b26\u53f7",
|
||||
"lira sign": "\u91cc\u62c9\u7b26\u53f7",
|
||||
"mill sign": "\u5bc6\u5c14\u7b26\u53f7",
|
||||
"naira sign": "\u5948\u62c9\u7b26\u53f7",
|
||||
"peseta sign": "\u6bd4\u585e\u5854\u7b26\u53f7",
|
||||
"rupee sign": "\u5362\u6bd4\u7b26\u53f7",
|
||||
"won sign": "\u97e9\u5143\u7b26\u53f7",
|
||||
"new sheqel sign": "\u65b0\u8c22\u514b\u5c14\u7b26\u53f7",
|
||||
"dong sign": "\u8d8a\u5357\u76fe\u7b26\u53f7",
|
||||
"kip sign": "\u8001\u631d\u57fa\u666e\u7b26\u53f7",
|
||||
"tugrik sign": "\u56fe\u683c\u91cc\u514b\u7b26\u53f7",
|
||||
"drachma sign": "\u5fb7\u62c9\u514b\u9a6c\u7b26\u53f7",
|
||||
"german penny symbol": "\u5fb7\u56fd\u4fbf\u58eb\u7b26\u53f7",
|
||||
"peso sign": "\u6bd4\u7d22\u7b26\u53f7",
|
||||
"guarani sign": "\u74dc\u62c9\u5c3c\u7b26\u53f7",
|
||||
"austral sign": "\u6fb3\u5143\u7b26\u53f7",
|
||||
"hryvnia sign": "\u683c\u91cc\u592b\u5c3c\u4e9a\u7b26\u53f7",
|
||||
"cedi sign": "\u585e\u5730\u7b26\u53f7",
|
||||
"livre tournois sign": "\u91cc\u5f17\u5f17\u5c14\u7b26\u53f7",
|
||||
"spesmilo sign": "spesmilo\u7b26\u53f7",
|
||||
"tenge sign": "\u575a\u6208\u7b26\u53f7",
|
||||
"indian rupee sign": "\u5370\u5ea6\u5362\u6bd4",
|
||||
"turkish lira sign": "\u571f\u8033\u5176\u91cc\u62c9",
|
||||
"nordic mark sign": "\u5317\u6b27\u9a6c\u514b",
|
||||
"manat sign": "\u9a6c\u7eb3\u7279\u7b26\u53f7",
|
||||
"ruble sign": "\u5362\u5e03\u7b26\u53f7",
|
||||
"yen character": "\u65e5\u5143\u5b57\u6837",
|
||||
"yuan character": "\u4eba\u6c11\u5e01\u5143\u5b57\u6837",
|
||||
"yuan character, in hong kong and taiwan": "\u5143\u5b57\u6837\uff08\u6e2f\u53f0\u5730\u533a\uff09",
|
||||
"yen\/yuan character variant one": "\u5143\u5b57\u6837\uff08\u5927\u5199\uff09",
|
||||
"Loading emoticons...": "\u52a0\u8f7d\u8868\u60c5\u7b26\u53f7...",
|
||||
"Could not load emoticons": "\u4e0d\u80fd\u52a0\u8f7d\u8868\u60c5\u7b26\u53f7",
|
||||
"People": "\u4eba\u7c7b",
|
||||
"Animals and Nature": "\u52a8\u7269\u548c\u81ea\u7136",
|
||||
"Food and Drink": "\u98df\u7269\u548c\u996e\u54c1",
|
||||
"Activity": "\u6d3b\u52a8",
|
||||
"Travel and Places": "\u65c5\u6e38\u548c\u5730\u70b9",
|
||||
"Objects": "\u7269\u4ef6",
|
||||
"Flags": "\u65d7\u5e1c",
|
||||
"Characters": "\u5b57\u7b26",
|
||||
"Characters (no spaces)": "\u5b57\u7b26(\u65e0\u7a7a\u683c)",
|
||||
"Error: Form submit field collision.": "\u9519\u8bef: \u8868\u5355\u63d0\u4ea4\u5b57\u6bb5\u51b2\u7a81\u3002",
|
||||
"Error: No form element found.": "\u9519\u8bef: \u6ca1\u6709\u8868\u5355\u63a7\u4ef6\u3002",
|
||||
"Update": "\u66f4\u65b0",
|
||||
"Color swatch": "\u989c\u8272\u6837\u672c",
|
||||
"Turquoise": "\u9752\u7eff\u8272",
|
||||
"Green": "\u7eff\u8272",
|
||||
"Blue": "\u84dd\u8272",
|
||||
"Purple": "\u7d2b\u8272",
|
||||
"Navy Blue": "\u6d77\u519b\u84dd",
|
||||
"Dark Turquoise": "\u6df1\u84dd\u7eff\u8272",
|
||||
"Dark Green": "\u6df1\u7eff\u8272",
|
||||
"Medium Blue": "\u4e2d\u84dd\u8272",
|
||||
"Medium Purple": "\u4e2d\u7d2b\u8272",
|
||||
"Midnight Blue": "\u6df1\u84dd\u8272",
|
||||
"Yellow": "\u9ec4\u8272",
|
||||
"Orange": "\u6a59\u8272",
|
||||
"Red": "\u7ea2\u8272",
|
||||
"Light Gray": "\u6d45\u7070\u8272",
|
||||
"Gray": "\u7070\u8272",
|
||||
"Dark Yellow": "\u6697\u9ec4\u8272",
|
||||
"Dark Orange": "\u6df1\u6a59\u8272",
|
||||
"Dark Red": "\u6df1\u7ea2\u8272",
|
||||
"Medium Gray": "\u4e2d\u7070\u8272",
|
||||
"Dark Gray": "\u6df1\u7070\u8272",
|
||||
"Black": "\u9ed1\u8272",
|
||||
"White": "\u767d\u8272",
|
||||
"Switch to or from fullscreen mode": "\u5207\u6362\u5168\u5c4f\u6a21\u5f0f",
|
||||
"Open help dialog": "\u6253\u5f00\u5e2e\u52a9\u5bf9\u8bdd\u6846",
|
||||
"history": "\u5386\u53f2",
|
||||
"styles": "\u6837\u5f0f",
|
||||
"formatting": "\u683c\u5f0f\u5316",
|
||||
"alignment": "\u5bf9\u9f50",
|
||||
"indentation": "\u7f29\u8fdb",
|
||||
"permanent pen": "\u8bb0\u53f7\u7b14",
|
||||
"comments": "\u5907\u6ce8",
|
||||
"Anchor": "\u951a\u70b9",
|
||||
"Special character": "\u7279\u6b8a\u7b26\u53f7",
|
||||
"Code sample": "\u4ee3\u7801\u793a\u4f8b",
|
||||
"Color": "\u989c\u8272",
|
||||
"Emoticons": "\u8868\u60c5",
|
||||
"Document properties": "\u6587\u6863\u5c5e\u6027",
|
||||
"Image": "\u56fe\u7247",
|
||||
"Insert link": "\u63d2\u5165\u94fe\u63a5",
|
||||
"Target": "\u6253\u5f00\u65b9\u5f0f",
|
||||
"Link": "\u94fe\u63a5",
|
||||
"Poster": "\u5c01\u9762",
|
||||
"Media": "\u5a92\u4f53",
|
||||
"Print": "\u6253\u5370",
|
||||
"Prev": "\u4e0a\u4e00\u4e2a",
|
||||
"Find and replace": "\u67e5\u627e\u548c\u66ff\u6362",
|
||||
"Whole words": "\u5168\u5b57\u5339\u914d",
|
||||
"Spellcheck": "\u62fc\u5199\u68c0\u67e5",
|
||||
"Caption": "\u6807\u9898",
|
||||
"Insert template": "\u63d2\u5165\u6a21\u677f"
|
||||
});
|
||||
14
script/verify-commit.js
Normal file
14
script/verify-commit.js
Normal file
@ -0,0 +1,14 @@
|
||||
const msgPath = process.env.HUSKY_GIT_PARAMS
|
||||
const msg = require('fs').readFileSync(msgPath, 'utf-8').trim()
|
||||
|
||||
const commitRE = /^(merge|feat|fix|docs|style|refactor|perf|test|workflow|build|ci|chore|release|workflow)(\(.+\))?: .{1,50}/
|
||||
|
||||
if (!commitRE.test(msg)) {
|
||||
console.log()
|
||||
console.error(`
|
||||
不合法的 commit 消息格式。
|
||||
请查看 git commit 提交规范：https://gitee.com/OKGENE_1/dashboard/projects/OKGENE_1/vue2.x-template/wikis/OKGENE_1%2Fvue2.x-template?doc_id=1047366&sort_id=3095531
|
||||
`)
|
||||
|
||||
process.exit(1)
|
||||
}
|
||||
94
src/App.vue
Normal file
94
src/App.vue
Normal file
@ -0,0 +1,94 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<transition name="fade">
|
||||
<router-view v-if="isRouterAlive" />
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
provide() {
|
||||
return {
|
||||
reload: this.reload,
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
isRouterAlive: true,
|
||||
permissionsJson: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
// console.log('开发环境')
|
||||
this.$httpApi
|
||||
.loginAdminTest({ loginname: 'admin', pwd: '123456' })
|
||||
.then((res) => {
|
||||
if (!res.success) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.getPermission()
|
||||
})
|
||||
} else {
|
||||
// console.log('生产环境')
|
||||
this.getPermission()
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
//将hasPermission挂载到window
|
||||
window['hasPermission'] = (data) => {
|
||||
return this.hasPermission(data)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 刷新页面
|
||||
reload() {
|
||||
this.isRouterAlive = false
|
||||
this.$nextTick(() => {
|
||||
this.isRouterAlive = true
|
||||
})
|
||||
},
|
||||
getPermission() {
|
||||
this.$httpApi.getPermission().then((res) => {
|
||||
if (!res.success) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
let permissionsList = res.data.permissionsList
|
||||
|
||||
for (let i in permissionsList) {
|
||||
this.permissionsJson[permissionsList[i].funkey] = 1
|
||||
}
|
||||
})
|
||||
},
|
||||
hasPermission(permission) {
|
||||
return this.permissionsJson.hasOwnProperty(permission)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
#app {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
/* // 页面切换动画 */
|
||||
.fade-enter-active {
|
||||
transition: all 1.5s ease;
|
||||
}
|
||||
.fade-leave-active {
|
||||
transition: all 1.5s ease;
|
||||
}
|
||||
.fade-enter {
|
||||
transform: translateX(5px);
|
||||
opacity: 0;
|
||||
}
|
||||
.fade-leave-to {
|
||||
transform: translateX(5px);
|
||||
opacity: 0;
|
||||
}
|
||||
</style>
|
||||
156
src/api/api.js
Normal file
156
src/api/api.js
Normal file
@ -0,0 +1,156 @@
|
||||
import httpAjax from './http.js'
|
||||
|
||||
class httpApi {
|
||||
|
||||
// 获取视频列表
|
||||
newsList = (data) => httpAjax({
|
||||
url: '/adm/component/getCourseList',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
|
||||
// 上传图片base64
|
||||
miniShop = (data) => httpAjax({
|
||||
url: '/upload/base64/miniShop',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
|
||||
// 保存
|
||||
save = (data) => httpAjax({
|
||||
url: '/adm/component/save',
|
||||
method: 'post',
|
||||
header: 'json',
|
||||
data
|
||||
})
|
||||
|
||||
//上架
|
||||
shelves = (data) => httpAjax({
|
||||
url: '/adm/shopTemplate/shelves',
|
||||
method: 'post',
|
||||
header: 'json',
|
||||
data
|
||||
})
|
||||
|
||||
//获取创建过的页面列表
|
||||
shopTemplate = (data) => httpAjax({
|
||||
url: '/adm/shopTemplate/list',
|
||||
method: 'post',
|
||||
header: 'json',
|
||||
data
|
||||
})
|
||||
|
||||
//获取页面模板
|
||||
shopTemplates = data => httpAjax({
|
||||
url: '/apiShop/shopTemplate',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//获取历史页面
|
||||
listData = data => httpAjax({
|
||||
url: '/adm/shopTemplate/list.data',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//设为主页
|
||||
homePage = data => httpAjax({
|
||||
url: '/adm/shopTemplate/homePage',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//删除选项
|
||||
delete = data => httpAjax({
|
||||
url: '/adm/shopTemplate/delete',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//获取下拉框模板类型
|
||||
selectData = data => httpAjax({
|
||||
url: '/adm/poster/select.data',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//获取海报
|
||||
poster = data => httpAjax({
|
||||
url: '/adm/shopTemplate/poster',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//复制
|
||||
copy = data => httpAjax({
|
||||
url: '/adm/shopTemplate/copy',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//导出
|
||||
exportTemplate = data => httpAjax({
|
||||
url: '/adm/shopTemplate/export',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
//导入
|
||||
importTemplate = data => httpAjax({
|
||||
url: '/adm/shopTemplate/import',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
//获取系统模板
|
||||
defaultTemplate = data => httpAjax({
|
||||
url: '/adm/shopTemplate/defaultTemplate',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
//获取当前用户权限
|
||||
getPermission = data => httpAjax({
|
||||
url: '/adm/permission/getPermission',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//获取当前用户权限
|
||||
loginAdminTest = data => httpAjax({
|
||||
url: '/loginAdminTest',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//设置为系统模板
|
||||
saveDefaultTemplate = data => httpAjax({
|
||||
url: '/adm/shopTemplate/saveDefaultTemplate',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//查看店铺概要信息
|
||||
queryShopInfo = data => httpAjax({
|
||||
url: '/adm/shop/queryShopInfo',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
//修改店铺信息，目前只支持名称和头像链接修改
|
||||
updateShopInfo = data => httpAjax({
|
||||
url: '/adm/shop/updateShopInfo',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
|
||||
//动态获取商品数据
|
||||
getShopCommodity = data => httpAjax({
|
||||
url: '/adm/shop/getShopCommodity',
|
||||
data,
|
||||
method: 'post'
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
export default new httpApi()
|
||||
16
src/api/http.js
Normal file
16
src/api/http.js
Normal file
@ -0,0 +1,16 @@
|
||||
import axios from "axios"
|
||||
import Qs from "qs"
|
||||
|
||||
// 请求封装
|
||||
export default function httpAjax (config) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const method = config.method ? config.method.toLowerCase() : "get"
|
||||
if(!config.data) config.data = {}
|
||||
if(['delete', 'get', 'head', 'options'].some(item => item === method)) {
|
||||
config.params = config.data
|
||||
delete config.data
|
||||
}else if (config.header === "form" && ['post', 'put', 'patch'].some(item => item === method)) config.data = Qs.stringify(config.data)
|
||||
axios(config).then(response => resolve(response.data)).catch( error => reject(error))
|
||||
})
|
||||
}
|
||||
|
||||
41
src/api/request.js
Normal file
41
src/api/request.js
Normal file
@ -0,0 +1,41 @@
|
||||
import axios from 'axios'
|
||||
import Vue from 'vue'
|
||||
let base = window.global_config.BASE_URL;
|
||||
|
||||
|
||||
// 推广链接
|
||||
Vue.prototype.$baseURL ='https://wshop.starfirelink.com/'
|
||||
|
||||
// 请求域名
|
||||
axios.defaults.baseURL = base
|
||||
|
||||
axios.defaults.withCredentials=true
|
||||
|
||||
// 请求拦截器
|
||||
/* axios.interceptors.request.use(
|
||||
config => {
|
||||
return config
|
||||
},
|
||||
error => {
|
||||
return error
|
||||
}
|
||||
) */
|
||||
|
||||
// 响应拦截器
|
||||
axios.interceptors.response.use(
|
||||
response => {
|
||||
const res = response.data
|
||||
// 1002:非法令牌和令牌过期 5012:其他客户端登录
|
||||
if (res.code === 1002 || res.code === 9018 || res.code === 9996) {
|
||||
// 清除全部数据
|
||||
/* localStorage.clear() */
|
||||
// 返回登录页面
|
||||
/* router.push({path: '/personalCourse'}) */
|
||||
}
|
||||
return response
|
||||
},
|
||||
error => {
|
||||
/* Toast("操作失败，请重新操作") */
|
||||
return error
|
||||
}
|
||||
)
|
||||
16
src/assets/css/minx.less
Normal file
16
src/assets/css/minx.less
Normal file
@ -0,0 +1,16 @@
|
||||
@themeColor: #f39800;
|
||||
|
||||
/* 下划线 */
|
||||
.bor {
|
||||
height: 1px;
|
||||
margin: 20px 0;
|
||||
background-color: rgb(235, 237, 240);
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
vertical-align: -0.15em;
|
||||
fill: currentColor;
|
||||
overflow: hidden;
|
||||
}
|
||||
194
src/assets/css/reset.css
Normal file
194
src/assets/css/reset.css
Normal file
@ -0,0 +1,194 @@
|
||||
|
||||
@charset "utf-8";
|
||||
|
||||
|
||||
|
||||
html {
|
||||
|
||||
-webkit-text-size-adjust: 100%;
|
||||
|
||||
-ms-text-size-adjust: 100%;
|
||||
|
||||
-webkit-overflow-scrolling : touch;
|
||||
|
||||
}
|
||||
|
||||
html, body, #app{width:100%;height:100%;}
|
||||
|
||||
|
||||
|
||||
input[type="submit"], input[type="reset"], input[type="button"], input {
|
||||
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
|
||||
resize: none;
|
||||
|
||||
border: none;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
body, div, ul, li, ol, h1, h2, h3, h4, h5, h6, input, textarea, select, p, dl, dt, dd, a, img, button, form, table, th, tr, td, tbody, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
|
||||
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
|
||||
font-size:14px;
|
||||
|
||||
box-sizing:border-box;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
|
||||
|
||||
display: block;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
img {
|
||||
|
||||
height: auto;
|
||||
|
||||
width: auto\9; /* ie8 */
|
||||
|
||||
-ms-interpolation-mode: bicubic;/*为了照顾ie图片缩放失真*/
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
body, div, ul, li, ol, h1, h2, h3, h4, h5, h6, input, textarea, select, p, dl, dt, dd, a, img, button, form, table, th, tr, td, tbody, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
|
||||
|
||||
margin: 0;
|
||||
|
||||
padding: 0;
|
||||
|
||||
}
|
||||
|
||||
body {
|
||||
|
||||
font: 12px/1.5 'Microsoft YaHei','宋体', Tahoma, Arial, sans-serif;
|
||||
|
||||
color: #555;
|
||||
|
||||
background-color: #fff;
|
||||
|
||||
overflow-x: hidden;
|
||||
|
||||
}
|
||||
|
||||
ul,li{
|
||||
|
||||
list-style-type: none;
|
||||
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
|
||||
content: "";
|
||||
|
||||
display: block;
|
||||
|
||||
visibility: hidden;
|
||||
|
||||
height: 0;
|
||||
|
||||
clear: both;
|
||||
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
|
||||
zoom: 1;
|
||||
|
||||
}
|
||||
|
||||
a {
|
||||
|
||||
text-decoration: none;
|
||||
|
||||
color: #969696;
|
||||
|
||||
font-family: 'Microsoft YaHei', Tahoma, Arial, sans-serif;
|
||||
|
||||
}
|
||||
|
||||
a:hover {
|
||||
|
||||
text-decoration: none;
|
||||
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
|
||||
list-style: none;
|
||||
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
|
||||
font-size: 100%;
|
||||
|
||||
font-family: 'Microsoft YaHei';
|
||||
|
||||
}
|
||||
|
||||
img {
|
||||
|
||||
border: none;
|
||||
|
||||
}
|
||||
|
||||
input{
|
||||
|
||||
font-family: 'Microsoft YaHei';
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.one-txt-cut{
|
||||
|
||||
overflow: hidden;
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
text-overflow: ellipsis;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.txt-cut{
|
||||
|
||||
overflow : hidden;
|
||||
|
||||
text-overflow: ellipsis;
|
||||
|
||||
display: -webkit-box;
|
||||
|
||||
-webkit-box-orient: vertical;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
a:link,a:active,a:visited,a:hover {
|
||||
|
||||
background: none;
|
||||
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
|
||||
}
|
||||
|
||||
i {
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
||||
input[type=button], input[type=submit], input[type=file], button { cursor: pointer; -webkit-appearance: none; }
|
||||
2884
src/assets/css/skin.css
Normal file
2884
src/assets/css/skin.css
Normal file
File diff suppressed because it is too large
Load Diff
539
src/assets/iconfont/demo.css
Normal file
539
src/assets/iconfont/demo.css
Normal file
@ -0,0 +1,539 @@
|
||||
/* Logo 字体 */
|
||||
@font-face {
|
||||
font-family: "iconfont logo";
|
||||
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
|
||||
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-family: "iconfont logo";
|
||||
font-size: 160px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
/* tabs */
|
||||
.nav-tabs {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nav-tabs .nav-more {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#tabs {
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
#tabs li {
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
border-bottom: 2px solid transparent;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin-bottom: -1px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
|
||||
#tabs .active {
|
||||
border-bottom-color: #f00;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.tab-container .content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 页面布局 */
|
||||
.main {
|
||||
padding: 30px 100px;
|
||||
width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.main .logo {
|
||||
color: #333;
|
||||
text-align: left;
|
||||
margin-bottom: 30px;
|
||||
line-height: 1;
|
||||
height: 110px;
|
||||
margin-top: -50px;
|
||||
overflow: hidden;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.main .logo a {
|
||||
font-size: 160px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.helps {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.helps pre {
|
||||
padding: 20px;
|
||||
margin: 10px 0;
|
||||
border: solid 1px #e7e1cd;
|
||||
background-color: #fffdef;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.icon_lists {
|
||||
width: 100% !important;
|
||||
overflow: hidden;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.icon_lists li {
|
||||
width: 100px;
|
||||
margin-bottom: 10px;
|
||||
margin-right: 20px;
|
||||
text-align: center;
|
||||
list-style: none !important;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.icon_lists li .code-name {
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.icon_lists .icon {
|
||||
display: block;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
font-size: 42px;
|
||||
margin: 10px auto;
|
||||
color: #333;
|
||||
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
|
||||
-moz-transition: font-size 0.25s linear, width 0.25s linear;
|
||||
transition: font-size 0.25s linear, width 0.25s linear;
|
||||
}
|
||||
|
||||
.icon_lists .icon:hover {
|
||||
font-size: 100px;
|
||||
}
|
||||
|
||||
.icon_lists .svg-icon {
|
||||
/* 通过设置 font-size 来改变图标大小 */
|
||||
width: 1em;
|
||||
/* 图标和文字相邻时，垂直对齐 */
|
||||
vertical-align: -0.15em;
|
||||
/* 通过设置 color 来改变 SVG 的颜色/fill */
|
||||
fill: currentColor;
|
||||
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
|
||||
normalize.css 中也包含这行 */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.icon_lists li .name,
|
||||
.icon_lists li .code-name {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* markdown 样式 */
|
||||
.markdown {
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.markdown img {
|
||||
vertical-align: middle;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.markdown h1 {
|
||||
color: #404040;
|
||||
font-weight: 500;
|
||||
line-height: 40px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.markdown h2,
|
||||
.markdown h3,
|
||||
.markdown h4,
|
||||
.markdown h5,
|
||||
.markdown h6 {
|
||||
color: #404040;
|
||||
margin: 1.6em 0 0.6em 0;
|
||||
font-weight: 500;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown h1 {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.markdown h2 {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.markdown h3 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.markdown h4 {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.markdown h5 {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown h6 {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown hr {
|
||||
height: 1px;
|
||||
border: 0;
|
||||
background: #e9e9e9;
|
||||
margin: 16px 0;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.markdown>p,
|
||||
.markdown>blockquote,
|
||||
.markdown>.highlight,
|
||||
.markdown>ol,
|
||||
.markdown>ul {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.markdown ul>li {
|
||||
list-style: circle;
|
||||
}
|
||||
|
||||
.markdown>ul li,
|
||||
.markdown blockquote ul>li {
|
||||
margin-left: 20px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.markdown>ul li p,
|
||||
.markdown>ol li p {
|
||||
margin: 0.6em 0;
|
||||
}
|
||||
|
||||
.markdown ol>li {
|
||||
list-style: decimal;
|
||||
}
|
||||
|
||||
.markdown>ol li,
|
||||
.markdown blockquote ol>li {
|
||||
margin-left: 20px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.markdown code {
|
||||
margin: 0 3px;
|
||||
padding: 0 5px;
|
||||
background: #eee;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.markdown strong,
|
||||
.markdown b {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown>table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0px;
|
||||
empty-cells: show;
|
||||
border: 1px solid #e9e9e9;
|
||||
width: 95%;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.markdown>table th {
|
||||
white-space: nowrap;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown>table th,
|
||||
.markdown>table td {
|
||||
border: 1px solid #e9e9e9;
|
||||
padding: 8px 16px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.markdown>table th {
|
||||
background: #F7F7F7;
|
||||
}
|
||||
|
||||
.markdown blockquote {
|
||||
font-size: 90%;
|
||||
color: #999;
|
||||
border-left: 4px solid #e9e9e9;
|
||||
padding-left: 0.8em;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.markdown blockquote p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.markdown .anchor {
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.markdown .waiting {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.markdown h1:hover .anchor,
|
||||
.markdown h2:hover .anchor,
|
||||
.markdown h3:hover .anchor,
|
||||
.markdown h4:hover .anchor,
|
||||
.markdown h5:hover .anchor,
|
||||
.markdown h6:hover .anchor {
|
||||
opacity: 1;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.markdown>br,
|
||||
.markdown>p>br {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
|
||||
.hljs {
|
||||
display: block;
|
||||
background: white;
|
||||
padding: 0.5em;
|
||||
color: #333333;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.hljs-comment,
|
||||
.hljs-meta {
|
||||
color: #969896;
|
||||
}
|
||||
|
||||
.hljs-string,
|
||||
.hljs-variable,
|
||||
.hljs-template-variable,
|
||||
.hljs-strong,
|
||||
.hljs-emphasis,
|
||||
.hljs-quote {
|
||||
color: #df5000;
|
||||
}
|
||||
|
||||
.hljs-keyword,
|
||||
.hljs-selector-tag,
|
||||
.hljs-type {
|
||||
color: #a71d5d;
|
||||
}
|
||||
|
||||
.hljs-literal,
|
||||
.hljs-symbol,
|
||||
.hljs-bullet,
|
||||
.hljs-attribute {
|
||||
color: #0086b3;
|
||||
}
|
||||
|
||||
.hljs-section,
|
||||
.hljs-name {
|
||||
color: #63a35c;
|
||||
}
|
||||
|
||||
.hljs-tag {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.hljs-title,
|
||||
.hljs-attr,
|
||||
.hljs-selector-id,
|
||||
.hljs-selector-class,
|
||||
.hljs-selector-attr,
|
||||
.hljs-selector-pseudo {
|
||||
color: #795da3;
|
||||
}
|
||||
|
||||
.hljs-addition {
|
||||
color: #55a532;
|
||||
background-color: #eaffea;
|
||||
}
|
||||
|
||||
.hljs-deletion {
|
||||
color: #bd2c00;
|
||||
background-color: #ffecec;
|
||||
}
|
||||
|
||||
.hljs-link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* 代码高亮 */
|
||||
/* PrismJS 1.15.0
|
||||
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
|
||||
/**
|
||||
* prism.js default theme for JavaScript, CSS and HTML
|
||||
* Based on dabblet (http://dabblet.com)
|
||||
* @author Lea Verou
|
||||
*/
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: black;
|
||||
background: none;
|
||||
text-shadow: 0 1px white;
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::-moz-selection,
|
||||
pre[class*="language-"] ::-moz-selection,
|
||||
code[class*="language-"]::-moz-selection,
|
||||
code[class*="language-"] ::-moz-selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::selection,
|
||||
pre[class*="language-"] ::selection,
|
||||
code[class*="language-"]::selection,
|
||||
code[class*="language-"] ::selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
padding: 1em;
|
||||
margin: .5em 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:not(pre)>code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #f5f2f0;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre)>code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: slategray;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #905;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #690;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #9a6e3a;
|
||||
background: hsla(0, 0%, 100%, .5);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword {
|
||||
color: #07a;
|
||||
}
|
||||
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #DD4A68;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important,
|
||||
.token.variable {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
1964
src/assets/iconfont/demo_index.html
Normal file
1964
src/assets/iconfont/demo_index.html
Normal file
File diff suppressed because it is too large
Load Diff
370
src/assets/iconfont/iconfont.css
Normal file
370
src/assets/iconfont/iconfont.css
Normal file
File diff suppressed because one or more lines are too long
BIN
src/assets/iconfont/iconfont.eot
Normal file
BIN
src/assets/iconfont/iconfont.eot
Normal file
Binary file not shown.
2
src/assets/iconfont/iconfont.js
Normal file
2
src/assets/iconfont/iconfont.js
Normal file
File diff suppressed because one or more lines are too long
555
src/assets/iconfont/iconfont.json
Normal file
555
src/assets/iconfont/iconfont.json
Normal file
@ -0,0 +1,555 @@
|
||||
{
|
||||
"id": "1670638",
|
||||
"name": "saas",
|
||||
"font_family": "iconfont",
|
||||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "153853",
|
||||
"name": "三栏",
|
||||
"font_class": "sanlan",
|
||||
"unicode": "e631",
|
||||
"unicode_decimal": 58929
|
||||
},
|
||||
{
|
||||
"icon_id": "7064798",
|
||||
"name": "上",
|
||||
"font_class": "shang",
|
||||
"unicode": "e626",
|
||||
"unicode_decimal": 58918
|
||||
},
|
||||
{
|
||||
"icon_id": "13742951",
|
||||
"name": "下",
|
||||
"font_class": "jiantou",
|
||||
"unicode": "e650",
|
||||
"unicode_decimal": 58960
|
||||
},
|
||||
{
|
||||
"icon_id": "2471390",
|
||||
"name": "搜索框",
|
||||
"font_class": "sousuokuang",
|
||||
"unicode": "e67b",
|
||||
"unicode_decimal": 59003
|
||||
},
|
||||
{
|
||||
"icon_id": "3091128",
|
||||
"name": "网页",
|
||||
"font_class": "wangye1",
|
||||
"unicode": "e6b2",
|
||||
"unicode_decimal": 59058
|
||||
},
|
||||
{
|
||||
"icon_id": "6984284",
|
||||
"name": "搜索框",
|
||||
"font_class": "sousuokuang1",
|
||||
"unicode": "e625",
|
||||
"unicode_decimal": 58917
|
||||
},
|
||||
{
|
||||
"icon_id": "8888796",
|
||||
"name": "置顶",
|
||||
"font_class": "zhiding",
|
||||
"unicode": "e6b7",
|
||||
"unicode_decimal": 59063
|
||||
},
|
||||
{
|
||||
"icon_id": "8543930",
|
||||
"name": "点线-1-01",
|
||||
"font_class": "dianxian--",
|
||||
"unicode": "e623",
|
||||
"unicode_decimal": 58915
|
||||
},
|
||||
{
|
||||
"icon_id": "10186963",
|
||||
"name": "虚线",
|
||||
"font_class": "xuxian",
|
||||
"unicode": "e644",
|
||||
"unicode_decimal": 58948
|
||||
},
|
||||
{
|
||||
"icon_id": "12195559",
|
||||
"name": "icon_分割线_实线",
|
||||
"font_class": "icon_fengexian_shixian",
|
||||
"unicode": "e624",
|
||||
"unicode_decimal": 58916
|
||||
},
|
||||
{
|
||||
"icon_id": "12195623",
|
||||
"name": "icon_无边距",
|
||||
"font_class": "icon_wubianju",
|
||||
"unicode": "e620",
|
||||
"unicode_decimal": 58912
|
||||
},
|
||||
{
|
||||
"icon_id": "12195627",
|
||||
"name": "icon_左右边距",
|
||||
"font_class": "icon_zuoyoubianju",
|
||||
"unicode": "e622",
|
||||
"unicode_decimal": 58914
|
||||
},
|
||||
{
|
||||
"icon_id": "4093372",
|
||||
"name": "辅助线条",
|
||||
"font_class": "fuzhuxiantiao",
|
||||
"unicode": "e6c3",
|
||||
"unicode_decimal": 59075
|
||||
},
|
||||
{
|
||||
"icon_id": "9343669",
|
||||
"name": "辅助空白_未选中",
|
||||
"font_class": "fuzhukongbai_weixuanzhong",
|
||||
"unicode": "e61f",
|
||||
"unicode_decimal": 58911
|
||||
},
|
||||
{
|
||||
"icon_id": "10946331",
|
||||
"name": "一左三右",
|
||||
"font_class": "yizuosanyou",
|
||||
"unicode": "e68b",
|
||||
"unicode_decimal": 59019
|
||||
},
|
||||
{
|
||||
"icon_id": "10945868",
|
||||
"name": "二左二右",
|
||||
"font_class": "erzuoeryou",
|
||||
"unicode": "e687",
|
||||
"unicode_decimal": 59015
|
||||
},
|
||||
{
|
||||
"icon_id": "10945870",
|
||||
"name": "一行二个",
|
||||
"font_class": "yihangerge",
|
||||
"unicode": "e688",
|
||||
"unicode_decimal": 59016
|
||||
},
|
||||
{
|
||||
"icon_id": "10945871",
|
||||
"name": "一行四个",
|
||||
"font_class": "yihangsige",
|
||||
"unicode": "e689",
|
||||
"unicode_decimal": 59017
|
||||
},
|
||||
{
|
||||
"icon_id": "10945873",
|
||||
"name": "一左二右",
|
||||
"font_class": "yizuoeryou",
|
||||
"unicode": "e68a",
|
||||
"unicode_decimal": 59018
|
||||
},
|
||||
{
|
||||
"icon_id": "13298738",
|
||||
"name": "一上二下",
|
||||
"font_class": "yishangerxia",
|
||||
"unicode": "e649",
|
||||
"unicode_decimal": 58953
|
||||
},
|
||||
{
|
||||
"icon_id": "10736318",
|
||||
"name": "固定",
|
||||
"font_class": "guding",
|
||||
"unicode": "e99a",
|
||||
"unicode_decimal": 59802
|
||||
},
|
||||
{
|
||||
"icon_id": "10945453",
|
||||
"name": "横向滑动",
|
||||
"font_class": "hengxianghuadong",
|
||||
"unicode": "e682",
|
||||
"unicode_decimal": 59010
|
||||
},
|
||||
{
|
||||
"icon_id": "1431118",
|
||||
"name": "列表切换-01",
|
||||
"font_class": "liebiaoqiehuan-",
|
||||
"unicode": "e61a",
|
||||
"unicode_decimal": 58906
|
||||
},
|
||||
{
|
||||
"icon_id": "13242812",
|
||||
"name": "图片",
|
||||
"font_class": "tupian",
|
||||
"unicode": "e61e",
|
||||
"unicode_decimal": 58910
|
||||
},
|
||||
{
|
||||
"icon_id": "12478860",
|
||||
"name": "commodity-一行两个",
|
||||
"font_class": "commodity-yihangliangge",
|
||||
"unicode": "e6fc",
|
||||
"unicode_decimal": 59132
|
||||
},
|
||||
{
|
||||
"icon_id": "12478861",
|
||||
"name": "commodity-详细列表",
|
||||
"font_class": "commodity-xiangxiliebiao",
|
||||
"unicode": "e6fd",
|
||||
"unicode_decimal": 59133
|
||||
},
|
||||
{
|
||||
"icon_id": "13319810",
|
||||
"name": "大图模式",
|
||||
"font_class": "datumoshi",
|
||||
"unicode": "e619",
|
||||
"unicode_decimal": 58905
|
||||
},
|
||||
{
|
||||
"icon_id": "10945869",
|
||||
"name": "一行三个",
|
||||
"font_class": "yihangsange",
|
||||
"unicode": "e686",
|
||||
"unicode_decimal": 59014
|
||||
},
|
||||
{
|
||||
"icon_id": "12372924",
|
||||
"name": "icon_商品图_一大两小",
|
||||
"font_class": "icon_shangpintu_yidaliangxiao",
|
||||
"unicode": "e61c",
|
||||
"unicode_decimal": 58908
|
||||
},
|
||||
{
|
||||
"icon_id": "10807892",
|
||||
"name": "选择模块-导航横向滑动",
|
||||
"font_class": "xuanzemokuai-daohanghengxianghuadong",
|
||||
"unicode": "e618",
|
||||
"unicode_decimal": 58904
|
||||
},
|
||||
{
|
||||
"icon_id": "13319791",
|
||||
"name": "一大两小",
|
||||
"font_class": "yidaliangxiao",
|
||||
"unicode": "e619",
|
||||
"unicode_decimal": 58905
|
||||
},
|
||||
{
|
||||
"icon_id": "10221268",
|
||||
"name": "富文本",
|
||||
"font_class": "fuwenben",
|
||||
"unicode": "e648",
|
||||
"unicode_decimal": 58952
|
||||
},
|
||||
{
|
||||
"icon_id": "200518",
|
||||
"name": "语音",
|
||||
"font_class": "yuyin",
|
||||
"unicode": "e615",
|
||||
"unicode_decimal": 58901
|
||||
},
|
||||
{
|
||||
"icon_id": "682955",
|
||||
"name": "积分",
|
||||
"font_class": "jifenzhang",
|
||||
"unicode": "e602",
|
||||
"unicode_decimal": 58882
|
||||
},
|
||||
{
|
||||
"icon_id": "1302693",
|
||||
"name": "运营",
|
||||
"font_class": "yunying",
|
||||
"unicode": "e641",
|
||||
"unicode_decimal": 58945
|
||||
},
|
||||
{
|
||||
"icon_id": "1604934",
|
||||
"name": "视频",
|
||||
"font_class": "shipin",
|
||||
"unicode": "e859",
|
||||
"unicode_decimal": 59481
|
||||
},
|
||||
{
|
||||
"icon_id": "1984308",
|
||||
"name": "自定义模块",
|
||||
"font_class": "zidingyimokuai",
|
||||
"unicode": "e6a4",
|
||||
"unicode_decimal": 59044
|
||||
},
|
||||
{
|
||||
"icon_id": "2179897",
|
||||
"name": "老师",
|
||||
"font_class": "laoshi",
|
||||
"unicode": "e657",
|
||||
"unicode_decimal": 58967
|
||||
},
|
||||
{
|
||||
"icon_id": "2260365",
|
||||
"name": "优惠券",
|
||||
"font_class": "youhuiquan",
|
||||
"unicode": "e612",
|
||||
"unicode_decimal": 58898
|
||||
},
|
||||
{
|
||||
"icon_id": "3275682",
|
||||
"name": "快速涨粉",
|
||||
"font_class": "kuaisuzhangfen",
|
||||
"unicode": "e621",
|
||||
"unicode_decimal": 58913
|
||||
},
|
||||
{
|
||||
"icon_id": "3419671",
|
||||
"name": "拼团",
|
||||
"font_class": "pintuan-copy",
|
||||
"unicode": "e647",
|
||||
"unicode_decimal": 58951
|
||||
},
|
||||
{
|
||||
"icon_id": "3497177",
|
||||
"name": "秒杀",
|
||||
"font_class": "miaosha",
|
||||
"unicode": "e607",
|
||||
"unicode_decimal": 58887
|
||||
},
|
||||
{
|
||||
"icon_id": "4138030",
|
||||
"name": "直播 播放 摄像机 天线 线性",
|
||||
"font_class": "zhibobofangshexiangjitianxianxianxing",
|
||||
"unicode": "e8c9",
|
||||
"unicode_decimal": 59593
|
||||
},
|
||||
{
|
||||
"icon_id": "4876074",
|
||||
"name": "周期购",
|
||||
"font_class": "zhouqi",
|
||||
"unicode": "e6c5",
|
||||
"unicode_decimal": 59077
|
||||
},
|
||||
{
|
||||
"icon_id": "5431418",
|
||||
"name": "课程",
|
||||
"font_class": "kecheng",
|
||||
"unicode": "e604",
|
||||
"unicode_decimal": 58884
|
||||
},
|
||||
{
|
||||
"icon_id": "5482045",
|
||||
"name": "店铺信息",
|
||||
"font_class": "dianpuxinxi",
|
||||
"unicode": "e61d",
|
||||
"unicode_decimal": 58909
|
||||
},
|
||||
{
|
||||
"icon_id": "7085948",
|
||||
"name": "在线客服",
|
||||
"font_class": "weibiaoti-_huaban",
|
||||
"unicode": "e638",
|
||||
"unicode_decimal": 58936
|
||||
},
|
||||
{
|
||||
"icon_id": "10276271",
|
||||
"name": "砍价",
|
||||
"font_class": "kanjia",
|
||||
"unicode": "e60e",
|
||||
"unicode_decimal": 58894
|
||||
},
|
||||
{
|
||||
"icon_id": "10284760",
|
||||
"name": "报名表单",
|
||||
"font_class": "baomingbiaodan",
|
||||
"unicode": "e666",
|
||||
"unicode_decimal": 58982
|
||||
},
|
||||
{
|
||||
"icon_id": "10293793",
|
||||
"name": "知识专栏",
|
||||
"font_class": "zhishizhuanlan",
|
||||
"unicode": "e64d",
|
||||
"unicode_decimal": 58957
|
||||
},
|
||||
{
|
||||
"icon_id": "10819303",
|
||||
"name": "商品搜索",
|
||||
"font_class": "shangpinsousuo",
|
||||
"unicode": "e62c",
|
||||
"unicode_decimal": 58924
|
||||
},
|
||||
{
|
||||
"icon_id": "12479513",
|
||||
"name": "Component-辅助分割",
|
||||
"font_class": "Component-fuzhufenge",
|
||||
"unicode": "e708",
|
||||
"unicode_decimal": 59144
|
||||
},
|
||||
{
|
||||
"icon_id": "12588171",
|
||||
"name": "限时折扣",
|
||||
"font_class": "xianshizhekou",
|
||||
"unicode": "e64a",
|
||||
"unicode_decimal": 58954
|
||||
},
|
||||
{
|
||||
"icon_id": "13256160",
|
||||
"name": "公告",
|
||||
"font_class": "gonggao",
|
||||
"unicode": "e614",
|
||||
"unicode_decimal": 58900
|
||||
},
|
||||
{
|
||||
"icon_id": "13319798",
|
||||
"name": "个性化推荐",
|
||||
"font_class": "gexinghuatuijian",
|
||||
"unicode": "e60f",
|
||||
"unicode_decimal": 58895
|
||||
},
|
||||
{
|
||||
"icon_id": "13319817",
|
||||
"name": "店铺笔记卡片",
|
||||
"font_class": "dianpubijikapian",
|
||||
"unicode": "e610",
|
||||
"unicode_decimal": 58896
|
||||
},
|
||||
{
|
||||
"icon_id": "13319826",
|
||||
"name": "知识付费会员",
|
||||
"font_class": "zhishifufeihuiyuan",
|
||||
"unicode": "e613",
|
||||
"unicode_decimal": 58899
|
||||
},
|
||||
{
|
||||
"icon_id": "13319830",
|
||||
"name": "知识专栏",
|
||||
"font_class": "zhishizhuanlan1",
|
||||
"unicode": "e616",
|
||||
"unicode_decimal": 58902
|
||||
},
|
||||
{
|
||||
"icon_id": "13370992",
|
||||
"name": "打卡",
|
||||
"font_class": "daka",
|
||||
"unicode": "e617",
|
||||
"unicode_decimal": 58903
|
||||
},
|
||||
{
|
||||
"icon_id": "13387260",
|
||||
"name": "魔方",
|
||||
"font_class": "mofang",
|
||||
"unicode": "e677",
|
||||
"unicode_decimal": 58999
|
||||
},
|
||||
{
|
||||
"icon_id": "13455314",
|
||||
"name": "进入店铺",
|
||||
"font_class": "jinrudianpu",
|
||||
"unicode": "e642",
|
||||
"unicode_decimal": 58946
|
||||
},
|
||||
{
|
||||
"icon_id": "6984276",
|
||||
"name": "轮播图",
|
||||
"font_class": "lunbotu",
|
||||
"unicode": "e606",
|
||||
"unicode_decimal": 58886
|
||||
},
|
||||
{
|
||||
"icon_id": "7928824",
|
||||
"name": "大图横向滑动",
|
||||
"font_class": "datuhengxianghuadong",
|
||||
"unicode": "e608",
|
||||
"unicode_decimal": 58888
|
||||
},
|
||||
{
|
||||
"icon_id": "7928825",
|
||||
"name": "小图横向滑动",
|
||||
"font_class": "xiaotuhengxianghuadong",
|
||||
"unicode": "e609",
|
||||
"unicode_decimal": 58889
|
||||
},
|
||||
{
|
||||
"icon_id": "7928827",
|
||||
"name": "导航横向滑动",
|
||||
"font_class": "daohanghengxianghuadong",
|
||||
"unicode": "e60b",
|
||||
"unicode_decimal": 58891
|
||||
},
|
||||
{
|
||||
"icon_id": "7928828",
|
||||
"name": "一行一个",
|
||||
"font_class": "yihangyige",
|
||||
"unicode": "e60d",
|
||||
"unicode_decimal": 58893
|
||||
},
|
||||
{
|
||||
"icon_id": "12356137",
|
||||
"name": "icon_图片_轮播海报",
|
||||
"font_class": "icon_tupian_lunbohaibao",
|
||||
"unicode": "e61b",
|
||||
"unicode_decimal": 58907
|
||||
},
|
||||
{
|
||||
"icon_id": "6019279",
|
||||
"name": "三角形左",
|
||||
"font_class": "sanjiaoxingzuo",
|
||||
"unicode": "e69b",
|
||||
"unicode_decimal": 59035
|
||||
},
|
||||
{
|
||||
"icon_id": "1314",
|
||||
"name": "居右",
|
||||
"font_class": "juyou",
|
||||
"unicode": "e600",
|
||||
"unicode_decimal": 58880
|
||||
},
|
||||
{
|
||||
"icon_id": "5362847",
|
||||
"name": "居中",
|
||||
"font_class": "juzhong",
|
||||
"unicode": "e603",
|
||||
"unicode_decimal": 58883
|
||||
},
|
||||
{
|
||||
"icon_id": "9270690",
|
||||
"name": "居左",
|
||||
"font_class": "horizontal-left",
|
||||
"unicode": "e601",
|
||||
"unicode_decimal": 58881
|
||||
},
|
||||
{
|
||||
"icon_id": "4627193",
|
||||
"name": "网页",
|
||||
"font_class": "wangye",
|
||||
"unicode": "e60c",
|
||||
"unicode_decimal": 58892
|
||||
},
|
||||
{
|
||||
"icon_id": "8314105",
|
||||
"name": "组件",
|
||||
"font_class": "zujian",
|
||||
"unicode": "e60a",
|
||||
"unicode_decimal": 58890
|
||||
},
|
||||
{
|
||||
"icon_id": "1500913",
|
||||
"name": "商品",
|
||||
"font_class": "goods",
|
||||
"unicode": "e741",
|
||||
"unicode_decimal": 59201
|
||||
},
|
||||
{
|
||||
"icon_id": "9682990",
|
||||
"name": "图片广告",
|
||||
"font_class": "tupianguanggao",
|
||||
"unicode": "e611",
|
||||
"unicode_decimal": 58897
|
||||
},
|
||||
{
|
||||
"icon_id": "12498113",
|
||||
"name": "icon_图片导航",
|
||||
"font_class": "icon_tupiandaohang",
|
||||
"unicode": "e6c0",
|
||||
"unicode_decimal": 59072
|
||||
},
|
||||
{
|
||||
"icon_id": "12479501",
|
||||
"name": "Component-标题文字",
|
||||
"font_class": "Component-biaotiwenzi",
|
||||
"unicode": "e707",
|
||||
"unicode_decimal": 59143
|
||||
},
|
||||
{
|
||||
"icon_id": "7879825",
|
||||
"name": "装修",
|
||||
"font_class": "zhuangxiu",
|
||||
"unicode": "e605",
|
||||
"unicode_decimal": 58885
|
||||
}
|
||||
]
|
||||
}
|
||||
260
src/assets/iconfont/iconfont.svg
Normal file
260
src/assets/iconfont/iconfont.svg
Normal file
@ -0,0 +1,260 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<!--
|
||||
2013-9-30: Created.
|
||||
-->
|
||||
<svg>
|
||||
<metadata>
|
||||
Created by iconfont
|
||||
</metadata>
|
||||
<defs>
|
||||
|
||||
<font id="iconfont" horiz-adv-x="1024" >
|
||||
<font-face
|
||||
font-family="iconfont"
|
||||
font-weight="500"
|
||||
font-stretch="normal"
|
||||
units-per-em="1024"
|
||||
ascent="896"
|
||||
descent="-128"
|
||||
/>
|
||||
<missing-glyph />
|
||||
|
||||
<glyph glyph-name="sanlan" unicode="" d="M202.88438035 160.68485641999996l0-74.34465409c0-45.23697853 36.71502113-81.95199967 81.95199965-81.95199966l454.32878495 1e-8c45.237751 0 81.95045471 36.71502113 81.9504547 81.95199965l0 74.34465409c0 45.23697853-36.71270371 81.95199967-81.95045471 81.95199966L284.83715248 242.63685607000002C239.59940147 242.63685607000002 202.88438035 205.92106247000004 202.88438035 160.68485641999996L202.88438035 160.68485641999996zM739.16593742 201.66085625000005c22.65904427 0 40.97445488-18.31618308 40.97445489-40.97599983l0-74.34465409c0-22.61810302-18.31541062-40.97599983-40.97445489-40.97599984L284.83715248 45.36420248000002c-22.61810302 0-40.97599983 18.35866928-40.97599982 40.97599986l0 74.34465408c0 22.6582718 18.3578968 40.97599983 40.97599982 40.97599983L739.16593742 201.66085625000005 739.16593742 201.66085625000005zM190.52476121 421.78181077l0-74.3446541c0-45.23697853 36.71502113-81.95199967 81.95199965-81.95199966l454.32878495 0c45.237751 0 81.95045471 36.71502113 81.9504547 81.95199966l0 74.3446541c0 45.23697853-36.71270371 81.95199967-81.95045471 81.95199965L272.47753334 503.73381041C227.23978233 503.73381041 190.52476121 467.01801682 190.52476121 421.78181077L190.52476121 421.78181077zM726.80631828 462.75781059c22.65904427 0 40.97445488-18.31618308 40.97445489-40.97599982l0-74.3446541c0-22.61810302-18.31541062-40.97599983-40.97445489-40.97599983L272.47753335 306.46115683999994c-22.61810302 0-40.97599983 18.35866928-40.97599984 40.97599984l0 74.34465409c0 22.6582718 18.3578968 40.97599983 40.97599983 40.97599983L726.80631828 462.75781059 726.80631828 462.75781059zM95.838 770.91l0-96.241c0-58.562 47.529-106.09 106.09-106.09l588.146 0c58.562 0 106.088 47.528 106.08799999 106.09l1e-8 96.24099999c0 58.561-47.526 106.09-106.088 106.09000001L201.92900001 877C143.36700001 877 95.838 829.47 95.838 770.91L95.838 770.91zM790.075 823.955c29.333 0 53.043-23.71099999 53.043-53.045l0-96.241c0-29.28-23.71-53.045-53.043-53.045L201.929 621.624c-29.28 0-53.045 23.766-53.045 53.045l0 96.241c0 29.33200001 23.765 53.045 53.045 53.045L790.075 823.955 790.075 823.955z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="shang" unicode="" d="M102.4 204.3904c0 11.4688 4.608 22.4256 12.5952 30.6176l363.9296 363.9296c8.192 8.0896 19.0464 12.5952 30.6176 12.5952s22.528-4.608 30.6176-12.5952l368.7424-368.7424c16.896-16.896 16.896-44.2368 0-61.1328s-44.2368-16.896-61.1328 0L509.5424 507.1872 176.128 173.8752c-12.288-12.3904-30.9248-16.0768-47.104-9.4208-16.0768 6.7584-26.624 22.528-26.624 39.936z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="jiantou" unicode="" d="M927.804 543.807L512 128.175 96.197 543.807l63.616 63.445 352.209-352.017 352.102 352.017z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="sousuokuang" unicode="" d="M847.152 246.272a130.88 130.88 0 0 1 29.504 82.976c0 72.584-58.784 131.424-131.296 131.424-72.496 0-131.28-58.84-131.28-131.424 0-72.568 58.792-131.416 131.28-131.416 31.608 0 60.616 11.192 83.264 29.816l98.2-98.288 18.56 18.576-98.232 98.336z m-101.8-22.144c-58 0-105.016 47.064-105.016 105.128 0 58.072 47.016 105.144 105.016 105.144 58.016 0 105.04-47.072 105.04-105.144s-47.024-105.128-105.04-105.128zM191.304 180c-34.624 0-62.688 36.44-62.688 81.392V447.944c0 44.96 28.064 81.392 62.688 81.392h657.288c34.624 0 62.688-36.432 62.688-81.392v-48.792a178.84 178.84 0 0 0 25.336-26.384V462.896c0 52.16-29.88 94.44-66.744 94.44h-699.84c-36.864 0-66.744-42.28-66.744-94.44v-216.464c0-52.16 29.872-94.44 66.744-94.44h487.424a178.28 178.28 0 0 0-18.456 28H191.304z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="wangye1" unicode="" d="M215.196805 713.658072c-17.838172 0-32.350463-14.512291-32.350464-32.350463s14.512291-32.350463 32.350464-32.350463 32.350463 14.512291 32.350463 32.350463-14.513306 32.350463-32.350463 32.350463zM431.699807 713.658072c-17.838172 0-32.350463-14.512291-32.350464-32.350463s14.511276-32.350463 32.350464-32.350463c17.835128 0 32.345389 14.512291 32.345389 32.350463s-14.510261 32.350463-32.345389 32.350463zM323.445768 713.658072c-17.835128 0-32.345389-14.512291-32.345388-32.350463s14.510261-32.350463 32.345388-32.350463c17.838172 0 32.350463 14.512291 32.350464 32.350463s-14.513306 32.350463-32.350464 32.350463zM864.703781 821.907036H161.071308c-47.681792 0-86.474945-38.793153-86.474945-86.47596v-703.630444c0-47.682807 38.793153-86.474945 86.474945-86.474945h703.632473c47.682807 0 86.474945 38.792138 86.474945 86.474945v703.631459c0 47.682807-38.792138 86.474945-86.474945 86.474945z m21.778078-281.199869v-481.845816c0-26.930809-21.909002-48.839812-48.839811-48.839812H188.131011c-26.929794 0-48.838797 21.909002-48.838796 48.839812V540.707167h747.189644zM139.292215 605.403019V708.372387c0 26.929794 21.909002 48.838797 48.838796 48.838797h649.511037c26.930809 0 48.839812-21.909002 48.839811-48.838797V605.403019H139.292215z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="sousuokuang1" unicode="" d="M979.626667 107.52H44.373333V544.426667h413.013334c6.826667 0 13.653333-6.826667 13.653333-13.653334s-6.826667-13.653333-13.653333-13.653333H75.093333v-375.466667h873.813334v375.466667h-58.026667c-6.826667 0-13.653333 6.826667-13.653333 13.653333s6.826667 13.653333 13.653333 13.653334h88.746667v-436.906667zM672.426667 336.213333c-88.746667 0-160.426667 71.68-160.426667 160.426667S583.68 657.066667 672.426667 657.066667s160.426667-71.68 160.426666-160.426667-71.68-160.426667-160.426666-160.426667z m0 293.546667c-71.68 0-133.12-58.026667-133.12-133.12s58.026667-133.12 133.12-133.12 133.12 58.026667 133.12 133.12-61.44 133.12-133.12 133.12zM860.16 312.32c-3.413333 0-6.826667 0-10.24 3.413333l-68.266667 68.266667c-6.826667 6.826667-6.826667 17.066667 0 20.48 6.826667 6.826667 17.066667 6.826667 20.48 0l68.266667-68.266667c6.826667-6.826667 6.826667-17.066667 0-20.48-3.413333-3.413333-6.826667-3.413333-10.24-3.413333z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="zhiding" unicode="" d="M704 483.2L537.2 650c-6.6 6.6-15.5 9.7-24.2 9.3-8.7 0.4-17.6-2.7-24.2-9.3L322 483.2c-12.5-12.5-12.5-32.9 0-45.4s32.9-12.5 45.4 0L513 583.5l145.7-145.7c12.5-12.5 32.9-12.5 45.4 0 12.4 12.5 12.4 32.9-0.1 45.4zM479.2 98V561.9c0 17.6 14.4 32.1 32.1 32.1 17.6 0 32.1-14.4 32.1-32.1V98c0-17.6-14.4-32.1-32.1-32.1-17.6 0-32.1 14.5-32.1 32.1zM895.9 704H130.1c-17.6 0-32.1 14.4-32.1 32.1 0 17.6 14.4 32.1 32.1 32.1h765.8c17.6 0 32.1-14.4 32.1-32.1 0-17.7-14.4-32.1-32.1-32.1z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="dianxian--" unicode="" d="M135.483077 448.984615v-78.76923h-78.769231v78.76923zM229.612308 448.984615v-78.76923h-78.769231v78.76923zM323.741538 448.984615v-78.76923h-78.76923v78.76923zM417.870769 449.378462v-78.769231h-78.769231v78.769231zM512 449.378462v-78.769231h-78.769231v78.769231zM606.129231 449.378462v-78.769231h-78.769231v78.769231zM700.652308 449.378462v-78.769231h-78.769231v78.769231zM794.781538 449.378462v-78.769231h-78.76923v78.769231zM888.910769 449.378462v-78.769231h-78.769231v78.769231zM983.04 449.378462v-78.769231h-78.769231v78.769231z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="xuxian" unicode="" d="M192 441.6v-128H0v128h192z m256 0v-128H320v128h128z m384 0h192v-128h-192v128z m-128 0v-128H576v128h128z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="icon_fengexian_shixian" unicode="" d="M143.36 435.2h742.4c20.48 0 40.96-15.36 40.96-40.96-5.12-20.48-20.48-35.84-46.08-35.84H143.36C117.76 358.4 102.4 373.76 102.4 399.36 102.4 419.84 117.76 435.2 143.36 435.2zM163.84 399.36m-61.44 0a61.44 61.44 0 1 1 122.88 0 61.44 61.44 0 1 1-122.88 0ZM860.16 399.36m-61.44 0a61.44 61.44 0 1 1 122.88 0 61.44 61.44 0 1 1-122.88 0Z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="icon_wubianju" unicode="" d="M844.8 407.04v51.2c0 20.48 15.36 40.96 40.96 40.96s35.84-15.36 35.84-40.96v-179.2c0-20.48-15.36-35.84-40.96-35.84s-40.96 15.36-40.96 40.96v51.2h-665.6v-51.2c5.12-25.6-10.24-40.96-30.72-40.96s-40.96 15.36-40.96 40.96v174.08c0 25.6 15.36 40.96 40.96 40.96s40.96-15.36 40.96-40.96v-51.2h660.48z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="icon_zuoyoubianju" unicode="" d="M194.56 407.04h640c20.48 0 40.96-15.36 40.96-40.96 0-20.48-15.36-40.96-40.96-40.96H194.56c-25.6 10.24-40.96 25.6-40.96 46.08s15.36 35.84 40.96 35.84zM230.4 458.24v-179.2c0-20.48-15.36-35.84-35.84-35.84-25.6 0-40.96 15.36-40.96 40.96v174.08c0 25.6 15.36 40.96 40.96 40.96 20.48 0 35.84-15.36 35.84-40.96zM102.4 509.44v-281.6c0-20.48-15.36-35.84-40.96-35.84-20.48 0-35.84 15.36-35.84 40.96v276.48c0 25.6 15.36 40.96 35.84 40.96 25.6 0 40.96-15.36 40.96-40.96zM870.4 458.24v-179.2c0-20.48-15.36-35.84-40.96-35.84-20.48 0-40.96 15.36-40.96 40.96v174.08c0 20.48 15.36 40.96 40.96 40.96s40.96-15.36 40.96-40.96zM998.4 509.44v-281.6c0-20.48-15.36-40.96-40.96-40.96-20.48 5.12-35.84 20.48-35.84 46.08v276.48c0 25.6 15.36 40.96 40.96 40.96 20.48 0 35.84-15.36 35.84-40.96z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="fuzhuxiantiao" unicode="" d="M73.143 822.857v-121.903c0-24.383 24.383-48.76 48.76-48.76h780.194c24.377 0 48.76 24.377 48.76 48.76V822.857H73.143z m828.954-707.046H121.903c-24.377 0-48.76-24.383-48.76-48.766v-121.903h877.714V67.046c0 24.383-24.383 48.765-48.76 48.765zM0 359.623h1024v48.76H0v-48.76z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="fuzhukongbai_weixuanzhong" unicode="" d="M621.714286 814.409143v-255.122286h249.197714a18.285714 18.285714 0 0 1 13.092571 31.049143l-230.912 236.836571a18.285714 18.285714 0 0 1-31.378285-12.8zM219.794286 859.355429h435.2l259.657143-263.314286v-541.257143a146.285714 146.285714 0 0 0-146.285715-146.285714h-548.571428a146.285714 146.285714 0 0 0-146.285715 146.285714v658.285714a146.285714 146.285714 0 0 0 146.285715 146.285715z m419.876571-36.571429H219.830857a109.714286 109.714286 0 0 1-109.714286-109.714286v-658.285714a109.714286 109.714286 0 0 1 109.714286-109.714286h548.571429a109.714286 109.714286 0 0 1 109.714285 109.714286V581.046857l-238.445714 241.737143zM640 577.572571v274.285715h-36.571429v-292.571429a18.285714 18.285714 0 0 1 18.285715-18.285714h292.571428v36.571428h-274.285714z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="yizuosanyou" unicode="" d="M540.458667 725.333333H938.666667v-292.565333h-398.208zM85.333333 725.333333h341.333334v-682.666666H85.333333zM540.458667 335.232h170.666666V42.666667h-170.666666zM768 335.232h170.666667V42.666667h-170.666667z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="erzuoeryou" unicode="" d="M85.333333 725.333333h373.333334v-298.666666H85.333333zM565.333333 725.333333H938.666667v-298.666666h-373.333334zM565.333333 341.333333H938.666667v-298.666666h-373.333334zM85.333333 341.333333h373.333334v-298.666666H85.333333z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="yihangerge" unicode="" d="M85.333333 725.333333h387.882667v-682.666666H85.333333zM550.784 725.333333H938.666667v-682.666666h-387.882667z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="yihangsige" unicode="" d="M85.333333 725.333333h142.208v-682.666666H85.333333zM322.389333 725.333333h142.208v-682.666666H322.389333zM559.402667 725.333333h142.208v-682.666666h-142.208zM796.458667 725.333333H938.666667v-682.666666h-142.208z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="yizuoeryou" unicode="" d="M540.458667 725.333333H938.666667v-292.565333h-398.208zM85.333333 725.333333h341.333334v-682.666666H85.333333zM540.458667 335.232H938.666667V42.666667h-398.208z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="yishangerxia" unicode="" d="M540.16 53.76V343.04c0 4.096 2.048 7.68 4.608 7.68h292.864c2.56 0 4.608-3.584 4.608-7.68v-289.28c0-4.096-2.048-7.68-4.608-7.68h-292.864c-2.048-0.512-4.608 3.072-4.608 7.68zM206.336 53.76V343.04c0 4.096 2.048 7.68 4.608 7.68h292.864c2.56 0 4.608-3.584 4.608-7.68v-289.28c0-4.096-2.048-7.68-4.608-7.68H210.944c-2.56-0.512-4.608 3.072-4.608 7.68zM206.336 390.656V679.936c0 4.096 4.608 7.68 10.24 7.68h619.52c5.632 0 10.24-3.584 10.24-7.68v-289.28c0-4.096-4.608-7.68-10.24-7.68h-619.52c-5.632 0-10.24 3.584-10.24 7.68z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="guding" unicode="" d="M901.54 586.9c-14.17 18.32-71.37 73.28-90.78 91.79a44.52 44.52 0 0 1-4 4.95c-17 18-73.93 78.05-92.61 92.65a47.16 47.16 0 0 1-47.77 6.64c-25.69-10.74-35.61-38.35-44.07-82.41-2.14-11.16-3.87-22.07-5.14-30.79L442.73 537.39c-23.84 9.26-50.9 13.51-80.83 12.66-30.89-0.88-65.09-7.22-101.66-18.85a598.57 598.57 0 0 1-109.15-47.52 43 43 0 0 1-9.1-67.17l168.44-172.6-188-184.19a43 43 0 0 1 60.18-61.44l188.15 184.34 166.51-170a43 43 0 0 1 67.58 8 605.18 605.18 0 0 1 49.08 108.82c12.17 36.51 19.05 70.73 20.45 101.71 1.37 30.35-2.5 57.85-11.5 82.12L795.52 490c8.63 1.27 19.41 3 30.42 5.14 43.81 8.49 71.28 18.42 82 44.05a47.23 47.23 0 0 1-6.4 47.71zM767 572.89A43 43 0 0 1 737.54 556l-159-211.84c-0.43-0.58-0.85-1.17-1.25-1.76v-0.07c-0.36-0.53-0.7-1.07-1-1.62l-0.18-0.29c-0.26-0.43-0.51-0.87-0.75-1.31l-0.36-0.65-0.44-0.87c-0.18-0.38-0.37-0.75-0.55-1.12 0-0.1-0.08-0.2-0.13-0.3a42.92 42.92 0 0 1-1.59-31.63c0-0.12 0.07-0.23 0.11-0.34 0.13-0.38 0.28-0.77 0.43-1.15s0.23-0.62 0.35-0.93 0.19-0.44 0.29-0.66c0.2-0.47 0.4-0.94 0.62-1.4l0.14-0.3c0.28-0.58 0.57-1.15 0.87-1.72v-0.06c0.34-0.64 0.7-1.27 1.07-1.89 12.45-20.6 22-61.27-3.33-138.07-5-15.23-10.69-29.56-16.2-42.21L402.7 272.9a42.13 42.13 0 0 1-3.58 3.26L245.1 434c12.32 5.18 26.29 10.51 41.19 15.25 70 22.25 109.77 16 131.8 5.11a44.22 44.22 0 0 1 57.51 0L683.41 612a43 43 0 0 1 16.72 29.33c1 8.35 2.2 17.07 3.56 25.51a3544.52 3544.52 0 0 0 40.46-42.22l0.11-0.11a43 43 0 0 1 5.82-6.83c13.92-13.26 29-27.88 42.53-41.22-8.42-1.33-17.18-2.57-25.61-3.57z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="hengxianghuadong" unicode="" d="M551.5264 41.984a58.9312 58.9312 0 0 0 0 79.2064l198.144 211.5072h-599.04C123.9552 332.8 102.4 355.7376 102.4 384.0512c0 28.2624 21.5552 51.2 48.1792 51.2H749.568l-198.0416 211.5072a58.9824 58.9824 0 0 0 0 79.2576 49.664 49.664 0 0 0 72.704 1.1264l1.0752-1.1264 281.088-300.6464c20.2752-23.5008 20.2752-59.392 0-82.944l-281.088-300.4416a49.8176 49.8176 0 0 0-72.7552-1.1776l-1.024 1.1776z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="liebiaoqiehuan-" unicode="" d="M974.98112 336.484352H258.537472c-26.259456 0-47.511552 21.250048-47.511552 47.511552 0 26.241024 21.252096 47.5136 47.511552 47.5136h716.443648c26.269696 0 47.519744-21.272576 47.519744-47.5136-0.002048-26.261504-21.252096-47.511552-47.519744-47.511552M974.98112 716.578816H258.537472c-26.259456 0-47.511552 21.272576-47.511552 47.5136 0 26.236928 21.252096 47.511552 47.511552 47.511552h716.443648c26.269696 0 47.519744-21.272576 47.519744-47.511552-0.002048-26.241024-21.252096-47.5136-47.519744-47.5136M66.553856-62.640128C29.800448-62.640128 0-32.843776 0 3.905536c0 36.753408 29.800448 66.54976 66.553856 66.54976 36.749312 0 66.54976-29.796352 66.54976-66.54976 0-36.75136-29.800448-66.545664-66.54976-66.545664M66.553856 317.446144C29.800448 317.446144 0 347.24864 0 383.993856c0 36.755456 29.800448 66.551808 66.553856 66.551808 36.749312 0 66.54976-29.796352 66.54976-66.551808 0-36.745216-29.800448-66.547712-66.54976-66.547712M66.553856 697.540608C29.800448 697.540608 0 727.33696 0 764.090368c0 36.753408 29.800448 66.551808 66.553856 66.551808 36.749312 0 66.54976-29.796352 66.54976-66.551808 0-36.753408-29.800448-66.54976-66.54976-66.54976M258.537472 51.419136h716.443648c26.269696 0 47.519744-21.252096 47.519744-47.5136s-21.250048-47.5136-47.519744-47.5136H258.537472c-26.259456 0-47.511552 21.252096-47.511552 47.5136 0 26.261504 21.250048 47.5136 47.511552 47.5136M258.537472 3.907584z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="tupian" unicode="" d="M846.309 833.276H177.805c-62.263 0-112.737-50.474-112.737-112.737v-669.504c0-62.263 50.474-112.737 112.737-112.737h668.503c62.263 0 112.737 50.474 112.737 112.737V720.539c0.001 62.263-50.473 112.737-112.736 112.737z m-649.41-62.666h630.316c39.24 0 71.165-31.924 71.165-71.165v-130.529c-143.468-5.03-277.551-63.167-379.453-165.068-47.755-47.756-85.875-102.593-113.454-162.137-79.811 67.708-195.35 72.049-279.739 13.016V699.445c0 39.241 31.924 71.165 71.165 71.165z m-71.165-701.481V172.074c73.163 71.031 177.056 70.958 250.12-0.234-17.875-65.981-22.392-99.147-22.392-167.777 0-2.125 0.329-4.174 0.934-6.1H196.899c-39.241 0.001-71.165 31.925-71.165 71.166z m701.481-71.165H415.194c0.605 1.926 0.934 3.974 0.934 6.1 0 140.24 53.535 265.009 152.556 364.03 94.219 94.219 197.094 130.122 329.697 135.132v-434.097c-0.001-39.241-31.925-71.165-71.166-71.165zM321.267 457.12c69.928 0 126.82 56.89 126.82 126.82s-56.89 126.82-126.82 126.82-126.82-56.89-126.82-126.82 56.891-126.82 126.82-126.82z m0 191.615c35.728 0 64.796-29.067 64.796-64.796s-29.067-64.796-64.796-64.796-64.796 29.067-64.796 64.796 29.067 64.796 64.796 64.796z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="commodity-yihangliangge" unicode="" d="M431.4368 335.5136V725.7856c0 20.5312-16.3328 37.1712-36.5312 37.1712H193.3056c-20.1728 0-36.608-16.64-36.608-37.1712v-454.0928c0-20.48 16.4352-37.12 36.608-37.12h201.6c20.224 0 36.5312 16.64 36.5312 37.12v63.8208z m435.2 0V725.7856c0 20.5312-16.3328 37.1712-36.5312 37.1712h-201.6c-20.1728 0-36.608-16.64-36.608-37.1712v-454.0928c0-20.48 16.4352-37.12 36.608-37.12h201.6c20.224 0 36.5312 16.64 36.5312 37.12v63.8208zM485.76 730.1376l-0.0512-394.0608 0.0512-0.3584v-68.352c0-48.5376-38.8096-88.0128-86.6304-88.0128H189.0048C141.2608 179.3536 102.4 218.8288 102.4 267.3664V730.1376c0 48.5376 38.8608 88.064 86.6048 88.064h210.1248c47.8208 0 86.6304-39.5264 86.6304-88.064z m435.2 0l-0.0512-394.0608 0.0512-0.3584v-68.352c0-48.5376-38.8096-88.0128-86.6304-88.0128h-210.1248c-47.744 0-86.6048 39.4752-86.6048 88.0128V730.1376c0 48.5376 38.8608 88.064 86.6048 88.064h210.1248c47.8208 0 86.6304-39.5264 86.6304-88.064zM128 25.6h332.8a25.6 25.6 0 1 0 0-51.2H128a25.6 25.6 0 0 0 0 51.2z m435.2 0h332.8a25.6 25.6 0 1 0 0-51.2H563.2a25.6 25.6 0 0 0 0 51.2zM183.3984 296.704l36.7872 50.2528a25.6 25.6 0 0 0 35.456 5.76l31.744-22.528a25.6 25.6 0 0 1 34.0992 4.0192l43.2128 49.536a25.6 25.6 0 0 0 44.9024-16.8192V281.6a25.6 25.6 0 0 0-25.6-25.6H204.0576a25.6 25.6 0 0 0-20.6592 40.704z m435.2 0l36.7872 50.2528a25.6 25.6 0 0 0 35.456 5.76l31.744-22.528a25.6 25.6 0 0 1 34.0992 4.0192l43.2128 49.536a25.6 25.6 0 0 0 44.9024-16.8192V281.6a25.6 25.6 0 0 0-25.6-25.6h-179.9424a25.6 25.6 0 0 0-20.6592 40.704z m-214.4256 313.1392c0-28.2368-22.9888-51.2-51.2256-51.2-28.2112 0-51.2 22.9632-51.2 51.2s22.9888 51.2 51.2 51.2c28.2368 0 51.2-22.9632 51.2-51.2z m440.6272 0c0-28.2368-22.9888-51.2-51.2-51.2-28.2368 0-51.2 22.9632-51.2 51.2s22.9632 51.2 51.2 51.2c28.2112 0 51.2-22.9632 51.2-51.2z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="commodity-xiangxiliebiao" unicode="" d="M866.6368 565.9136V725.7856c0 20.5312-16.3328 37.1712-36.5312 37.1712H193.3056c-20.1728 0-36.608-16.64-36.608-37.1712v-223.6928c0-20.48 16.4352-37.12 36.608-37.12h636.8c20.224 0 36.5312 16.64 36.5312 37.12v63.8208z m54.3232 164.224l-0.0512-163.6608 0.0512-0.3584v-68.352c0-48.5376-38.8096-88.0128-86.6304-88.0128H189.0048C141.2608 409.7536 102.4 449.2288 102.4 497.7664V730.1376c0 48.5376 38.8608 88.064 86.6048 88.064h645.3248c47.8208 0 86.6304-39.5264 86.6304-88.064zM819.2 609.8432c0-28.2368-22.9888-51.2-51.2-51.2-28.2368 0-51.2 22.9632-51.2 51.2s22.9632 51.2 51.2 51.2c28.2112 0 51.2-22.9632 51.2-51.2z m47.4368-503.7056V265.984c0 20.5056-16.3328 37.1712-36.5312 37.1712H193.3056c-20.1728 0-36.608-16.64-36.608-37.1712v-223.6928c0-20.48 16.4352-37.12 36.608-37.12h636.8c20.224 0 36.5312 16.64 36.5312 37.12v63.8208z m54.3232 164.1984l-0.0512-163.6608 0.0512-0.3328v-68.352c0-48.5632-38.8096-88.064-86.6304-88.064H189.0048C141.2608-50.048 102.4-10.5472 102.4 38.016V270.336C102.4 318.8736 141.2608 358.4 189.0048 358.4h645.3248c47.8208 0 86.6304-39.5264 86.6304-88.064zM819.2 150.0672c0-28.2624-22.9888-51.2-51.2-51.2-28.2368 0-51.2 22.9376-51.2 51.2 0 28.2112 22.9632 51.2 51.2 51.2 28.2112 0 51.2-22.9888 51.2-51.2zM209.408 92.032l60.8512 82.2272a25.6 25.6 0 0 0 35.3024 5.7088l53.3504-37.4784a25.6 25.6 0 0 1 33.92 4.0192l74.368 84.3008a25.6 25.6 0 0 0 44.8-16.9216V76.8a25.6 25.6 0 0 0-25.6-25.6H229.9904a25.6 25.6 0 0 0-20.5824 40.832z m0 460.8l60.8512 82.2272a25.6 25.6 0 0 0 35.3024 5.7088l53.3504-37.4784a25.6 25.6 0 0 1 33.92 4.0192l74.368 84.3008a25.6 25.6 0 0 0 44.8-16.9216V537.6a25.6 25.6 0 0 0-25.6-25.6H229.9904a25.6 25.6 0 0 0-20.5824 40.832z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="datumoshi" unicode="" d="M851.968 33.28H208.896c-45.056 0-81.92 36.864-81.92 81.92v537.6c0 45.056 36.864 81.92 81.92 81.92h643.072c45.056 0 81.92-36.864 81.92-81.92v-537.6c0-45.056-36.864-81.92-81.92-81.92zM421.888 400.896l-51.2-91.136c-16.896-30.208 1.024-71.168 31.744-71.168h312.32c30.208 0 48.64 40.96 31.232 71.168L675.84 435.2c-13.824 24.576-43.52 27.136-59.904 4.608l-26.624-36.352-25.088-33.792c-15.36-20.48-42.496-20.48-57.344 1.024l-24.064 34.304c-16.384 23.04-46.592 20.992-60.928-4.096zM344.064 493.568m-35.84 0a35.84 35.84 0 1 1 71.68 0 35.84 35.84 0 1 1-71.68 0Z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="yihangsange" unicode="" d="M85.333333 725.333333h203.178667v-682.666666H85.333333zM410.410667 725.333333h203.178666v-682.666666H410.410667zM735.488 725.333333H938.666667v-682.666666h-203.178667z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="icon_shangpintu_yidaliangxiao" unicode="" d="M102.4 793.6h819.2c30.72 0 51.2-20.48 51.2-51.2v-665.6c0-30.72-20.48-51.2-51.2-51.2H102.4c-30.72 0-51.2 20.48-51.2 51.2V742.4c0 30.72 20.48 51.2 51.2 51.2z m76.8-102.4c-15.36 0-25.6-10.24-25.6-25.6v-256c0-15.36 10.24-25.6 25.6-25.6h665.6c15.36 0 25.6 10.24 25.6 25.6v256c0 15.36-10.24 25.6-25.6 25.6h-665.6z m0-358.4c-15.36 0-25.6-10.24-25.6-25.6v-153.6c0-15.36 10.24-25.6 25.6-25.6H460.8c15.36 0 25.6 10.24 25.6 25.6v153.6c0 15.36-10.24 25.6-25.6 25.6H179.2z m384 0c-15.36 0-25.6-10.24-25.6-25.6v-153.6c0-15.36 10.24-25.6 25.6-25.6h281.6c15.36 0 25.6 10.24 25.6 25.6v153.6c0 15.36-10.24 25.6-25.6 25.6H563.2z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="xuanzemokuai-daohanghengxianghuadong" unicode="" d="M1407.808-21.312V792.896c0 28.16-28.288 102.272-104.32 102.272H104.32C18.432 895.168 0 821.12 0 792.96v-814.144c0-42.624 36.48-105.6 104.384-105.6l1199.104 1.6c64.64 0 104.32 50.112 104.32 103.936z m-1305.024-4.8V794.496h1201.984v-820.544H102.784zM192 512h256v-256H192zM512 512h256v-256H512zM832 512h256v-256h-256zM1152 512h64v-256h-64z" horiz-adv-x="1408" />
|
||||
|
||||
|
||||
<glyph glyph-name="yidaliangxiao" unicode="" d="M833.536 33.28H190.464c-45.056 0-81.92 36.864-81.92 81.92v537.6c0 45.056 36.864 81.92 81.92 81.92h643.072c45.056 0 81.92-36.864 81.92-81.92v-537.6c0-45.056-36.864-81.92-81.92-81.92zM173.99808 322.99008v287.232h675.84v-287.232zM173.85984 135.15264v146.432h315.392v-146.432zM534.51264 134.94784v146.432h315.392v-146.432z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="fuwenben" unicode="" d="M997.376 24.576v-64c0-36.352-29.184-65.536-65.536-65.536h-61.952c-36.352 0-65.536 29.184-65.536 65.536v1.024H217.088v-1.024c0-36.352-29.184-65.536-65.536-65.536H89.6c-36.352 0-65.536 29.184-65.536 65.536v64c0 35.84 28.16 64.512 64 65.536V675.328c-36.352 1.024-64.512 29.696-64.512 65.536V804.864C23.552 841.216 52.736 870.4 89.088 870.4h62.464c35.84 0 64.512-28.16 65.536-64H803.84c1.024 35.328 29.696 64 65.536 64H931.84c36.352 0 65.536-29.184 65.536-65.536v-64c0-36.352-28.672-65.024-64.512-65.536v-584.704c35.84-1.024 64.512-30.208 64.512-66.048M803.84 740.864v1.024H217.088v-1.024c0-36.352-28.672-65.024-64.512-65.536v-584.704c35.328-0.512 63.488-28.672 64.512-64H803.84c1.024 34.816 28.672 62.976 63.488 63.488V675.328c-34.816 1.024-63.488 29.696-63.488 65.536m-66.048-195.584h-130.56V220.16h64.512v-64.512H347.648V220.16h65.536V545.28H282.624v-64.512H218.112V610.304h584.704v-129.536h-64.512l-0.512 64.512m0 0z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="yuyin" unicode="" d="M496.859161 131.372441c108.168582 0 196.164728 88.010473 196.164728 196.164728L693.02389 551.725138c0 108.154255-87.99717 196.164728-196.164728 196.164728s-196.164728-88.010473-196.164728-196.164728l0-224.188992C300.694433 219.382914 388.69058 131.372441 496.859161 131.372441zM356.741937 551.725138c0 77.255525 62.862723 140.118248 140.118248 140.118248s140.118248-62.862723 140.118248-140.118248l0-224.188992c0-77.255525-62.862723-140.118248-140.118248-140.118248s-140.118248 62.862723-140.118248 140.118248L356.741937 551.725138zM833.142138 327.53717l-56.047504 0c0-154.513096-125.70498-280.235472-280.235472-280.235472-154.527422 0-280.235472 125.722376-280.235472 280.235472l-56.047504 0c0-175.968757 135.930879-320.547597 308.258713-334.859557l0-85.494163L301.131385-92.81655l0-56.047504 391.892505 0 0 56.047504L524.885472-92.81655l0 85.494163C697.211259 6.989573 833.142138 151.568413 833.142138 327.53717z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="jifenzhang" unicode="" d="M971.219 98.338c0 0-90.867-18.184-182.799-37.065-61.404-68.455-122.462-136.564-122.462-136.564l-131.633 224.447c-7.407-0.361-14.828-1.059-22.407-1.059-7.587 0-14.823 0.698-22.415 1.059l-131.448-224.447c0 0-61.062 68.109-122.462 136.564-92.108 18.881-182.813 37.065-182.813 37.065l143.106 244.212c-23.12 46.22-36.342 97.751-36.342 152.804 0 191.63 157.741 347.262 352.374 347.262 194.806 0 352.545-155.632 352.545-347.262 0-55.053-13.404-106.584-36.337-152.804l143.093-244.212zM672.667 28.808c0 0 44.11 41.83 85.574 82.054 58.759 16.758 118.049 33.7 118.049 33.7l-83.289 141.872c-47.811-62.459-116.632-108.342-196.215-127.755l75.882-129.87zM147.72 144.562c0 0 59.29-16.942 118.048-33.7 41.469-40.223 85.398-82.054 85.398-82.054l76.058 129.87c-79.583 19.414-148.405 65.296-196.397 127.76l-83.108-141.877zM511.918 744.176c-135.439 0-245.205-110.074-245.205-245.661 0-135.74 109.766-245.803 245.205-245.803 135.431 0 245.206 110.063 245.206 245.803-0 135.587-109.774 245.661-245.206 245.661v0zM511.917 336.469c-89.338 0-161.887 72.405-161.887 161.891 0 89.475 72.549 161.88 161.887 161.88 89.475 0 161.88-72.405 161.88-161.88 0-89.486-72.403-161.891-161.88-161.891v0zM511.918 641.815z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="yunying" unicode="" d="M512 896c-282.624 0-512-229.376-512-512s229.376-512 512-512S1024 101.376 1024 384s-229.376 512-512 512z m237.056-310.784c32.256 0 58.88-26.112 58.88-58.88 0-32.256-26.112-58.88-58.88-58.88-32.256 0-58.88 26.624-58.88 58.88 0 32.768 26.624 58.88 58.88 58.88zM512 691.2c58.88 0 105.984-47.616 105.984-105.984 0-58.368-47.104-105.984-105.984-105.984-58.368 0-105.984 47.104-105.984 105.984 0 58.368 47.104 105.984 105.984 105.984zM274.944 595.456c32.256 0 58.368-26.112 58.368-58.88 0-32.256-26.112-58.88-58.368-58.88-32.256 0-58.88 26.112-58.88 58.88 0 32.256 26.624 58.88 58.88 58.88z m0-355.84c-68.096 0-123.392 7.168-123.392 15.872l6.144 5.632 28.672 24.576-20.992 23.552c0 76.288 49.152 137.728 110.08 137.728 28.672 0 54.784-14.336 74.752-37.376-40.96-40.448-68.096-101.376-73.728-169.472-0.512-0.512-1.024-0.512-1.536-0.512z m458.752-134.144c0-15.872-99.328-28.672-222.208-28.672s-222.208 13.312-222.208 28.672l10.752 8.704 51.712 45.056-38.4 42.496c0 8.192 0.512 16.384 1.024 24.064 5.12 68.608 32.768 129.024 73.216 169.984 34.304 34.304 77.312 54.784 124.416 54.784 47.104 0 90.112-19.968 124.416-54.272 40.96-40.96 68.608-101.376 73.728-169.984 0.512-7.68 1.024-15.872 1.024-24.064h-1.024l-38.4-42.496 53.248-46.08 8.704-7.168v-1.024z m138.24 155.648c0-8.704-54.784-16.384-123.392-16.384-5.632 69.12-33.28 129.536-73.728 169.984 19.456 23.04 45.568 37.376 74.752 37.376 60.928 0 110.08-61.952 110.08-138.24h-0.512l-21.504-23.552 29.696-25.6 4.608-3.584z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="shipin" unicode="" d="M399.36 226.986667l256 129.706666c23.893333 10.24 23.893333 44.373333 0 58.026667l-256 129.706667c-20.48 10.24-47.786667-3.413333-47.786667-27.306667v-256c0-30.72 23.893333-44.373333 47.786667-34.133333zM928.426667 769.706667H95.573333C44.373333 769.706667 0 725.333333 0 674.133333v-576.853333c0-54.613333 44.373333-95.573333 95.573333-95.573333h832.853334c51.2 0 95.573333 44.373333 95.573333 95.573333V674.133333c0 51.2-44.373333 95.573333-95.573333 95.573334zM191.146667 93.866667c0-17.066667-13.653333-34.133333-30.72-34.133334H95.573333c-17.066667 0-30.72 13.653333-30.72 34.133334v64.853333c0 17.066667 13.653333 34.133333 30.72 34.133333h64.853334c17.066667 0 30.72-13.653333 30.72-34.133333v-64.853333z m0 259.413333c0-17.066667-13.653333-34.133333-30.72-34.133333H95.573333c-17.066667 0-30.72 13.653333-30.72 34.133333V418.133333c0 17.066667 13.653333 34.133333 30.72 34.133334h64.853334c17.066667 0 30.72-13.653333 30.72-34.133334v-64.853333z m0 256c0-17.066667-13.653333-34.133333-30.72-34.133333H95.573333c-17.066667 0-30.72 13.653333-30.72 34.133333V674.133333c0 17.066667 13.653333 34.133333 30.72 34.133334h64.853334c17.066667 0 30.72-13.653333 30.72-34.133334v-64.853333z m576.853333-546.133333h-512V704.853333h512v-641.706666z m191.146667 30.72c0-17.066667-13.653333-34.133333-30.72-34.133334h-64.853334c-17.066667 0-30.72 13.653333-30.72 34.133334v64.853333c0 17.066667 13.653333 34.133333 30.72 34.133333h64.853334c17.066667 0 30.72-13.653333 30.72-34.133333v-64.853333z m0 259.413333c0-17.066667-13.653333-34.133333-30.72-34.133333h-64.853334c-17.066667 0-30.72 13.653333-30.72 34.133333V418.133333c0 17.066667 13.653333 34.133333 30.72 34.133334h64.853334c17.066667 0 30.72-13.653333 30.72-34.133334v-64.853333z m0 256c0-17.066667-13.653333-34.133333-30.72-34.133333h-64.853334c-17.066667 0-30.72 13.653333-30.72 34.133333V674.133333c0 17.066667 13.653333 34.133333 30.72 34.133334h64.853334c17.066667 0 30.72-13.653333 30.72-34.133334v-64.853333z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="zidingyimokuai" unicode="" d="M46.545455 477.090909h372.363636V849.454545H46.545455v-372.363636zM0 849.687273C0 875.287273 21.224727 896 46.312727 896h372.829091c25.6 0 46.312727-21.224727 46.312727-46.312727v-372.829091c0-25.6-21.224727-46.312727-46.312727-46.312727H46.312727C20.712727 430.545455 0 451.770182 0 476.858182V849.687273z m0-558.545455c0 25.6 21.224727 46.312727 46.312727 46.312727h372.829091c25.6 0 46.312727-21.224727 46.312727-46.312727v-372.829091c0-25.6-21.224727-46.312727-46.312727-46.312727H46.312727C20.712727-128 0-106.775273 0-81.687273v372.829091zM46.545455-81.454545h372.363636v372.363636H46.545455v-372.363636zM558.545455 849.687273c0 25.6 21.224727 46.312727 46.312727 46.312727h372.829091c25.6 0 46.312727-21.224727 46.312727-46.312727v-372.829091c0-25.6-21.224727-46.312727-46.312727-46.312727h-372.829091c-25.6 0-46.312727 21.224727-46.312727 46.312727V849.687273zM605.090909 477.090909h372.363636V849.454545h-372.363636v-372.363636z m-46.545454-139.636364h93.090909v-46.545454h-93.090909v46.545454z m186.181818 0h93.090909v-46.545454h-93.090909v46.545454z m186.181818 0h93.090909v-46.545454h-93.090909v46.545454z m-372.363636-418.90909h93.090909v-46.545455h-93.090909v46.545455z m186.181818 0h93.090909v-46.545455h-93.090909v46.545455z m186.181818 0h93.090909v-46.545455h-93.090909v46.545455z m-372.363636 325.818181h46.545454v-93.090909h-46.545454v93.090909z m0-139.636363h46.545454v-93.090909h-46.545454v93.090909z m418.90909 93.090909h46.545455v-93.090909h-46.545455v93.090909z m0-139.636364h46.545455v-93.090909h-46.545455v93.090909z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="laoshi" unicode="" d="M955.013565-102.13287l-9.104695-17.318956H66.782609l0.534261 26.401391c1.046261 49.797565 6.277565 117.359304 23.81913 183.518609 18.18713 68.207304 49.463652 135.034435 102.800696 180.936348l7.568695 6.433391 9.928348-0.044522 116.602435 1.135305-0.044522-53.782261-106.674087 0.912695c-39.958261-37.910261-64.512-92.382609-79.426782-148.569043-13.512348-50.576696-19.144348-102.310957-21.281392-145.14087l782.180174 0.178087c1.357913 48.90713-13.000348 106.718609-30.697739 160.946087-17.764174 54.694957-43.208348 101.286957-73.794783 133.520696h-121.900521V278.928696h139.330782l10.707479-3.494957c40.781913-37.910261 73.97287-99.661913 95.565913-166.177391 22.661565-69.609739 39.579826-151.418435 33.012869-211.389218z m-435.400348 69.298087l-69.676521 51.934609 45.100521 180.023652-17.051826 27.826087 1.335652 28.449392c32.567652 1.758609 42.073043 1.758609 74.662957 0l1.335652-28.471653-17.074087-27.826087 51.044174-180.001391-69.676522-51.934609z m201.638957 522.017392c-17.875478-61.306435-42.22887-107.208348-74.885565-141.200696-35.172174-36.685913-79.36-58.657391-134.656-70.188522l-4.496696-0.890434-4.452174 0.690086c-49.953391 8.325565-94.096696 29.362087-130.782609 66.404174-33.658435 33.970087-60.571826 81.207652-79.293217 144.11687-15.760696 8.45913-27.514435 22.505739-35.483826 41.405217-8.770783 20.72487-12.844522 47.86087-12.310261 79.961044l0.178087 12.399304 10.48487 6.967652a109.30087 109.30087 0 0 0 10.640695 6.411131c-16.005565 96.389565-11.842783 178.554435 47.059479 233.293913 46.83687 33.792 129.113043 10.685217 204.510608 21.882435 214.973217 31.944348 213.526261-76.065391 234.963478-259.161044 1.246609-0.75687 2.515478-1.513739 3.784348-2.404174l10.462609-6.967652 0.222609-12.421565c0.512-31.454609-3.33913-58.10087-11.798261-78.714435-7.635478-18.721391-18.988522-32.901565-34.148174-41.583304z m-25.800348 96.389565l-3.272348 10.885565-6.989913-0.445217-4.006956 20.902956c-3.116522 16.294957-7.880348 100.685913-14.06887 114.554435-18.632348-7.791304-39.490783 6.522435-58.323478 17.207652l-9.572174-29.517913-15.382261 2.003478 2.048 17.986783-16.250435-25.666783-14.447304 2.827131 14.202435 38.110609c-76.04313-52.246261-207.070609-49.597217-224.389565-26.245566-2.715826-3.31687-3.227826-7.991652-4.630261-12.109913-3.584-14.113391-7.590957-101.732174-11.174957-115.712l-0.957217-5.12-0.333913 0.044522a183.941565 183.941565 0 0 0-2.226087-7.479652c-6.522435 4.229565-19.767652 0.890435-31.588174-0.890435 1.113043-15.560348 3.762087-28.672 8.125217-38.912 4.34087-10.395826 10.329043-17.118609 17.875478-19.389217l12.911305-3.962435 3.517217-12.8c16.584348-60.282435 40.448-104.136348 70.344348-134.366609 27.870609-28.115478 61.417739-44.588522 99.461565-51.667478 43.230609 9.683478 77.601391 27.091478 104.69287 55.251478 28.694261 29.874087 50.109217 72.503652 66.137043 131.31687l3.339131 12.243478 12.154435 4.229565c7.41287 2.537739 13.267478 9.394087 17.541565 19.812174 4.140522 10.173217 6.767304 22.973217 7.835826 38.177391a212.368696 212.368696 0 0 1-22.572522-1.29113z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="youhuiquan" unicode="" d="M890.781737 297.484929v-124.161293c0-33.278707-26.395152-60.251798-58.967919-60.251798H192.139636c-32.536566 0.019394-58.930424 26.971798-58.949818 60.231111V297.252202c23.069737 4.918303 45.137455 16.85204 57.475879 36.459313 8.67297 13.785212 17.289051 32.563717 17.28905 50.16695 0 17.563152-8.012283 33.932929-16.70206 47.716848-12.356525 19.626667-35.011232 33.952323-58.079677 38.887434v123.507071C133.228606 627.268525 159.622465 654.222222 192.15903 654.222222h639.653495c32.535273 0 58.948525-26.953697 58.967919-60.231111V470.252606c-23.258505-5.263515-43.040323-20.089535-55.113697-40.256646-8.066586-13.438707-18.629818-29.248646-18.667313-46.117495 0-16.889535 10.600727-32.678788 18.667313-46.138182 12.092768-20.146424 31.856485-34.972444 55.11499-40.255354zM853.315232 614.968889H386.437172v-56.587636h-44.410829V614.968889H170.657616v-103.321859c42.417131-26.086141 76.74699-73.610343 76.74699-127.749171 0-54.176323-34.349253-101.683717-76.74699-127.767273v-103.784727h171.368727v56.335515h44.410829v-56.335515H853.333333v109.258989c-41.81204 26.220606-76.899556 68.578263-76.899555 122.312405 0 53.695354 35.048727 96.033616 76.881454 122.236121V614.968889zM674.332444 364.944808h-58.09907c-2.305293 0-4.498101-0.634828-6.652121-1.966545-2.097131-1.157172-3.022869-0.076283-3.022869-2.448808 0-2.583273 0.037495-5.051475 0.341333-7.845495 0.320646-2.816 0.41503-2.738424 0.41503-4.473536 0-3.683556 3.136646-5.012687 8.899233-3.683555h57.285818c5.877657 0 8.786747-2.795313 8.786747-8.426021v-18.681535c0-6.034101-4.30804-9.157818-12.488404-9.157818h-17.420929c-4.591192 0-9.353051-0.21204-14.47305-0.424081-4.911838-0.424081-9.616808-0.519758-13.716687-0.519757h-7.972202c-5.157495 0-7.879111-3.123717-7.879111-9.369859v-43.053253c0-3.201293-2.399677-4.742465-7.104647-4.742464h-20.631273c-7.633455 0-11.450182 3.373253-11.450181 10.140444 0 2.584566 0.209455 7.809293 0.455111 15.908202 0.41503 8.000646 0.208162 19.568485-0.416324 22.692202 0 3.046141-0.34004 5.108364-0.906343 6.034101-0.510707 0.906343-2.190222 1.31103-5.253172 1.311031h-57.191434c-7.670949 0-11.487677 4.01196-11.487677 12.108282 0 1.735111-0.151273 4.124444-0.831353 6.997334-0.605091 2.699636-0.605091 3.741737 0 6.941737 0.680081 3.065535 1.568323 5.842747 2.684121 8.42602 1.22699 2.371232 3.532283 3.315071 7.00897 2.699637h63.313454c1.228283 0 1.73899 1.523071 1.73899 4.741171v12.147071c0 3.104323-3.532283 4.646788-10.485657 4.646788h-55.414949c-2.399677 0-4.402424 0.098263-6.19701 0.365899-1.833374 0.310303-2.684121 2.045414-2.684121 5.033374v9.523717c0 4.839434-0.302545 8.541091-0.868849 11.106263-1.208889 3.683556-0.302545 6.80598 2.570344 9.157818 2.947879 2.584566 6.839596 3.682263 11.486383 3.682262 4.742465-0.636121 9.920646-0.731798 15.605657-0.42408 5.518222 0.327111 6.312081 0.424081 9.239273 0.42408h10.467555c3.55297 0 4.742465 1.31103 3.55297 3.683556-1.135192 1.369212-1.701495 6.014707-7.539071 13.89899-5.990141 8.270869-15.078141 21.324283-21.520808 29.962343-7.670949 10.585212-16.570182 22.017293-26.564525 34.337616-4.081778 6.786586-3.212929 12.435394 2.663434 16.638707 2.910384 1.890263 5.990141 4.222707 9.201778 7.095596 3.268525 2.737131 7.029657 5.359192 11.148929 7.808 5.837576 3.721051 11.411394 0.365899 16.721455-10.101656 1.851475-2.584566 5.157495-7.01802 10.220606-13.553778 5.026909-6.574545 10.183111-13.304242 15.400081-20.860121 5.232485-7.518384 10.276202-14.113616 15.039353-19.858101 4.760566-5.957818 7.329616-9.581899 8.029091-10.797253 1.133899-2.468202 3.268525-4.009374 6.498263-4.627394 3.269818-0.636121 5.575111 0.404687 6.689616 2.796606 0.510707 1.31103 2.986667 5.108364 7.461495 11.68291a901.647515 901.647515 0 0 1 14.586828 21.690181c5.328162 8.039434 10.334384 15.539717 14.982465 22.787879 4.800646 7.076202 7.727838 11.587232 8.899232 13.380525 2.911677 4.376566 5.518222 7.095596 7.425293 8.309657 2.097131 1.252848 5.479434 0.886949 10.278788-0.88695 2.909091-1.214061 6.198303-3.065535 9.561212-5.494949 3.608566-2.50699 6.026343-4.415354 7.103354-5.688889 6.499556-6.824081 8.331636-12.686222 5.328161-17.524364-1.114505-1.947152-4.402424-6.593939-9.618101-14.016646-5.515636-7.364525-11.089455-15.211313-17.286464-23.637333-6.291394-8.327758-11.770828-20.937697-16.75895-28.494869-5.025616-7.424-7.784727-11.857455-8.50101-12.937051-1.569616-3.065535-0.964525-4.91701 2.209616-5.650101 3.307313-0.636121 6.499556-0.943838 9.296162-0.943838h36.011959c2.852202 0 5.364364-1.09899 7.461495-3.701656 2.097131-2.468202 3.118545-4.82004 3.118546-7.307637v-20.454141c0.05301-4.362343-2.989253-6.406465-8.751839-6.406465zM342.043152 498.266505h44.32808v-93.952l-44.32808 0.019394v93.932606z m44.309979-246.725818h-44.326788v111.323798h44.326788v-111.323798z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="kuaisuzhangfen" unicode="" d="M512 896C229.220174 896 0 666.779826 0 384s229.220174-512 512-512 512 229.220174 512 512S794.779826 896 512 896z m253.773913-648.525913h-66.782609v-66.782609a22.26087 22.26087 0 1 0-44.521739 0v66.782609h-66.782608a22.26087 22.26087 0 1 0 0 44.521739h66.782608v66.782609a22.26087 22.26087 0 1 0 44.521739 0v-66.782609h66.782609a22.26087 22.26087 0 1 0 0-44.521739z m-20.457739 90.178783l-1.068522-1.135305H743.513043v22.26087a66.782609 66.782609 0 0 1-133.565217 0v-22.26087h-22.260869a66.782609 66.782609 0 0 1 0-133.565217h22.260869v-6.077218c-23.574261-24.30887-45.612522-46.970435-62.664348-64.467478a49.129739 49.129739 0 0 0-35.261217-15.048348 49.196522 49.196522 0 0 0-35.305739 15.09287 139228.004174 139228.004174 0 0 0-191.109565 197.008696c-27.492174 28.382609-46.525217 61.462261-53.270261 101.487304-11.731478 69.654261 20.057043 139.442087 79.805217 174.836869a161.680696 161.680696 0 0 0 82.632348 22.928696c40.982261 0 81.497043-15.872 113.396869-46.703304 1.001739-0.934957 2.048-1.78087 2.048-1.78087 16.205913 10.841043 30.742261 22.728348 47.014957 31.098435a155.069217 155.069217 0 0 0 71.43513 17.452522c78.157913 0 151.885913-58.768696 163.617392-144.962783 7.613217-56.364522-8.926609-105.961739-46.970435-146.164869z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="pintuan-copy" unicode="" d="M1248.234943-77.02871700000003L1086.89849 735.6074590000001c-3.194781 15.973906-19.822165 27.518684-39.499113 27.518684h-201.634263l-20.62086 105.209956C822.022081 884.382614 805.394697 896 785.64514 896h-583.773665c-19.749557 0-36.304332-11.617386-39.499114-27.663901L0.963299 48.22122999999999a43.565199 43.565199 0 0 1 8.567823-36.304333 42.330852 42.330852 0 0 1 32.964333-15.102602h235.106857l-14.521733-74.060838a42.98433 42.98433 0 0 1 8.422605-35.868681 42.40346 42.40346 0 0 1 32.964334-14.739559h902.235269a42.40346 42.40346 0 0 1 33.036943 15.102603 42.98433 42.98433 0 0 1 8.495213 35.723463z m-1205.303836 113.1243a4.066085 4.066085 0 0 0-2.831738 0.871303 4.792172 4.792172 0 0 0-0.363043 3.703042L199.911041 856.646104a8.71304 8.71304 0 0 0 1.960434 0h583.701056a8.71304 8.71304 0 0 0 1.960434 0l18.369992-93.592569H463.69832c-19.749557 0-36.304332-11.544778-39.499114-27.518684l-138.827767-699.439268H42.640673z m1166.966461-124.233426a3.920868 3.920868 0 0 0-2.904346-0.871304H304.467518a3.920868 3.920868 0 0 0-2.831738 0.871304 4.429129 4.429129 0 0 0 0 3.485216l16.699993 84.153442h550.88194v35.142594H324.943162l136.794724 689.128838a9.003474 9.003474 0 0 0 2.033043 0h583.701056a9.003474 9.003474 0 0 0 2.033043 0l160.39254-808.061831a4.429129 4.429129 0 0 0-0.363043-3.77565zM941.245509 652.325321h-0.508261a31.294335 31.294335 0 0 1-30.786074-31.729987l2.686521-180.650358c1.016521-67.235624-63.387364-122.92647-143.474722-124.088208a159.303411 159.303411 0 0 0-104.919521 35.505637 111.962561 111.962561 0 0 0-42.185634 84.226051l-2.759129 180.650358a31.294335 31.294335 0 1 1-62.516061-0.943912l2.686521-180.650358a173.607318 173.607318 0 0 1 64.476494-130.695597 220.730341 220.730341 0 0 1 142.530809-50.317805h3.630434c114.576473 1.742608 206.571651 85.89605 205.046869 187.548182l-2.686521 180.359923a31.294335 31.294335 0 0 1-31.221725 30.786074zM887.006836 36.53123400000004h39.063462v-39.063461h-39.063462z" horiz-adv-x="1249" />
|
||||
|
||||
|
||||
<glyph glyph-name="miaosha" unicode="" d="M789.10976 677.25824c64.8704-62.57664 109.28128-147.15392 120.4736-243.68128 25.66656-221.2864-132.92032-421.48352-354.21184-447.14496-109.02016-12.65152-212.86912 19.49696-293.30944 81.75616l-28.55936-33.00352c89.3696-69.9392 205.24032-106.10176 326.87616-91.99616 245.1712 28.43648 420.86912 250.24 392.43264 495.4112-12.50304 107.79136-62.39232 202.13248-135.18848 271.62624l-28.51328-32.96768zM229.2224 38.5792l27.10016 34.0992c-79.76448 64.07168-135.38816 158.28992-148.10112 267.96032-25.67168 221.29152 132.9152 421.48864 354.21696 447.1552 110.14144 12.7744 215.04-20.1216 295.81312-83.64544l27.08992 34.07872C695.81824 808.704 579.52256 845.18912 457.41568 831.0272c-245.17632-28.43136-420.87424-250.22464-392.43776-495.40096 14.10048-121.57952 75.77088-226.05824 164.24448-297.04704zM674.16576 639.80032l-40.28928-0.20992-15.22176-328.11008 31.18592-25.6-75.96032-254.81216 137.74848 273.19808-42.58304 35.84 5.12 299.69408z m0 0M255.45728 135.5264c16.14336 66.37568 27.50464 178.79552 27.50464 307.95264v35.28192h40.66304v-35.28192c0-132.75136-10.76224-249.34912-28.70272-317.52192l-39.46496 9.56928zM358.30784 126.56128V511.65184H260.8384v40.65792h97.46944V605.53216L271.00672 599.552l-3.59424 40.66304 213.4784 14.94528 3.58912-40.65792-85.50912-5.98016v-56.21248H491.0592v-40.65792H398.97088v-385.09056zM443.81696 478.76096h40.66304v-346.22464h-40.66304zM595.10272 640.05632c-4.7872-113.6128-19.73248-210.4832-47.84128-293.00736l-38.272 13.1584c23.80288 69.82656 40.2688 161.38752 44.8512 280.44288l41.26208-0.59392zM747.17184 645.17632l47.23712-285.824-40.66304-6.58432-47.23712 285.83424z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="zhibobofangshexiangjitianxianxianxing" unicode="" d="M524.344889 668.444444l77.056 128.398223a28.444444 28.444444 0 1 0 48.753778-29.269334L590.705778 668.444444H739.555556a56.888889 56.888889 0 0 0 56.888888-56.888888v-150.670223l129.877334 62.520889A28.444444 28.444444 0 0 0 967.111111 497.777778v-312.888889a28.444444 28.444444 0 0 0-40.789333-25.656889L796.444444 221.752889V42.666667a56.888889 56.888889 0 0 0-56.888888-56.888889H113.777778a56.888889 56.888889 0 0 0-56.888889 56.888889V611.555556a56.888889 56.888889 0 0 0 56.888889 56.888888h148.878222L203.178667 767.573333a28.444444 28.444444 0 0 0 48.753777 29.297778L329.016889 668.444444h195.328z m16.554667-56.888888a28.444444 28.444444 0 0 0-0.967112 0h-226.531555a28.444444 28.444444 0 0 0-0.967111 0H113.777778v-568.888889h625.777778V611.555556h-198.656zM796.444444 397.511111v-112.384l111.786667-53.816889v220.017778L796.444444 397.511111z m-455.111111-164.522667V449.706667a28.444444 28.444444 0 0 0 42.154667 24.917333l196.977778-108.344889a28.444444 28.444444 0 0 0 0-49.834667l-196.977778-108.373333A28.444444 28.444444 0 0 0 341.333333 233.016889z m56.803556 170.581334v-124.472889l113.152 62.236444-113.152 62.236445z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="zhouqi" unicode="" d="M205.824 355.84h87.552v-30.208H205.824v30.208z m314.88 27.648c8.192 0 15.872-2.048 23.04-5.12 26.624 32.768 57.344 61.952 91.136 87.04l25.088-23.552c-24.576-37.376-53.76-70.656-87.552-100.352 5.632-28.672-12.8-56.32-40.96-61.952-28.672-5.632-56.32 12.8-61.952 40.96-3.072 13.824 0 28.672 8.192 40.448-39.424 52.736-72.704 109.568-99.328 169.472l26.624 14.336c38.912-52.224 73.216-106.496 100.864-163.328 4.608 1.024 9.728 2.048 14.848 2.048zM445.44 670.208v-90.112l248.32 142.848-247.808 143.36v-92.16C352.256 760.32 266.24 716.8 199.68 650.24c-82.432-81.92-129.024-194.048-129.024-310.272 0-116.736 46.08-228.352 129.024-310.272 82.432-82.432 194.56-128.512 311.296-128.512 116.736 0 228.864 46.08 311.296 128.512 49.152 49.152 86.528 109.568 107.52 175.616l5.12 15.872-98.816 29.184-5.12-14.848c-16.384-50.176-44.544-95.744-81.92-133.12-62.976-63.488-148.992-98.816-238.592-98.816s-175.104 35.328-238.592 98.816c-63.488 62.976-98.816 148.48-98.816 237.568 0 89.6 35.328 174.592 98.816 237.568 47.616 47.616 108.032 79.36 173.568 92.672z m398.336-280.064c-3.072 21.504-8.704 42.496-15.872 62.976l-5.632 14.848 96.256 35.84 5.632-15.36c10.752-29.696 18.432-60.416 22.528-91.648l2.56-17.408-102.912-3.584-2.56 14.336z m-1.536-111.616c4.096 22.528 6.144 45.056 5.632 67.584l-0.512 15.872 102.912 3.584 0.512-16.384v-9.216c0-29.696-3.072-58.88-8.704-88.064l-3.584-17.408-98.816 29.184 2.56 14.848z m-31.744 216.064c-9.216 17.408-19.456 33.792-31.744 49.664l-9.728 12.8L849.92 620.032l10.24-12.8c17.408-23.04 32.768-47.616 45.568-73.216l7.68-15.872-96.768-35.84-6.144 12.288z m-51.2 72.704l-10.24 10.24c-14.848 14.848-31.232 28.672-49.152 40.448l-14.336 9.728 64.512 80.896 12.8-8.704c23.552-16.384 45.568-35.328 65.536-56.32l12.288-12.8-81.408-63.488zM510.976 41.472v87.04h30.208v-87.04h-30.208z m220.672 87.04l-61.952 61.952 21.504 20.992 61.952-61.952-21.504-20.992z m-438.784 7.168l61.952 61.952 21.504-20.992-61.952-61.952-21.504 20.992zM300.032 573.44l61.952-61.952-20.992-20.992-61.952 61.44 20.992 21.504z m438.784-7.168l-21.504 20.992L655.36 525.312l21.504-20.992 61.952 61.952z m87.552-220.672h-87.552v30.208h87.552v-30.208z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="kecheng" unicode="" d="M1096.991556 427.859639c-0.02909-94.143929-3.345314-188.4527 1.21207-282.354216 2.76352-56.73459-17.977428-83.797697-71.9388-96.199601-80.384507-18.462256-160.12904-40.23104-239.282083-63.50279-55.929775-16.445371-110.938376-28.818185-155.649228-77.950669-41.666131-45.78717-119.316207-47.08651-157.452789-7.514837-79.560299 82.527447-186.30976 79.996644-279.871895 116.950246-21.18699 8.348741-44.090272 12.401904-66.246918 18.307111-150.907609 40.20195-125.57049 20.56641-126.772864 175.70172-1.309036 169.893479 0.494525 339.816047-0.969656 509.728919-0.387863 43.906037 7.960878 72.850277 60.332015 65.76209 35.004592-4.71253 53.098379 11.432248 50.024568 46.766523-4.848281 55.755237 26.006182 66.363277 72.472111 61.340457 112.528613-12.140097 223.340934-31.48474 320.655639-93.503956 31.969568-20.401568 55.367374-20.653679 87.046045 0.242414 98.827369 65.189993 212.1511 83.177117 327.268696 93.513652 42.693967 3.839839 73.887809-4.702833 69.786163-57.423045-2.986541-38.59232 15.417535-55.49343 53.6026-50.858473 49.025822 5.95369 56.928521-22.127557 56.307941-62.824031-1.532057-98.701314-0.523614-197.451111-0.523615-296.181514z m-158.034582 84.767353h-0.446042c0 91.933113-0.766028 183.895316 0.349076 275.809036 0.484828 39.542584-11.8492 62.019216-55.706754 56.763679-91.923416-11.024992-181.28694-30.24358-261.012081-80.34572-28.275177-17.764103-49.025822-39.92075-48.89007-77.310697 0.698153-179.270055 0.59149-358.5692 0.135752-537.848952-0.106662-46.68895 18.326504-47.629517 55.221926-29.56482 76.96162 37.709933 158.693949 61.311367 245.022448 63.095535 50.965135 1.066622 67.148698 26.267989 65.926932 74.295065-2.162334 84.980677-0.601187 170.068017-0.601187 255.106874z m-779.215796 8.300258h-0.465435c0-87.113921 1.958706-174.276325-0.746636-261.302978-1.590236-51.886308 17.560475-75.924088 70.426137-77.407662 83.691035-2.375658 163.677982-25.404995 237.40095-62.9113 51.023314-25.977092 58.974496-7.766947 58.780564 37.845685-0.601187 146.6993-0.02909 293.417994-0.048483 440.136688-0.02909 149.016779-18.374987 174.761153-161.224751 216.669698-43.838161 12.828553-89.218075 20.721555-134.142252 29.526034-48.744622 9.551114-72.501201-7.301512-70.72673-61.253188 2.850789-87.016956 0.746635-174.189056 0.746636-261.302977z m889.523895-103.927762c0 73.577519 2.48232 147.271398-1.134497 220.674379-1.599933 32.405913 22.573598 89.74169-27.547936 91.341623-52.710516 1.687202-31.368381-56.560052-31.969568-88.713854-2.501713-137.904518-3.316225-275.944788 0-413.800823 1.386608-57.384259-14.61272-83.84618-75.846515-86.056996-118.831379-4.285881-232.387827-30.456904-328.926807-106.167667-25.928609-20.323996-49.956692-16.978682-75.158059 2.104154-93.426384 70.775213-202.667862 97.663782-316.360062 102.958105-67.109912 3.122293-84.680084 30.21449-82.798951 93.794853 4.179219 142.41342 1.89083 285.04986 0.64967 427.608728-0.242414 27.063107 11.674662 69.815253-32.260465 69.863736-40.337702 0.058179-28.003674-40.754654-28.168515-65.519675-1.076318-165.530026 0.213324-331.089141-1.037532-496.619167-0.319987-42.325497 10.57895-67.235967 56.812162-78.212476 95.995973-22.786923 190.401709-52.245081 285.660743-78.222173 35.925766-9.812922 68.069872-22.127557 93.271239-53.476545 32.464093-40.415274 92.757321-41.704917 123.776626-2.104154 24.91047 31.746547 56.337031 44.924176 92.369458 54.708008 95.307517 25.821947 189.606591 55.929775 285.874068 77.27191 52.885054 11.723145 64.676075 39.55228 63.308859 87.181797-2.268996 80.394203-0.610883 160.904765-0.513918 241.386237z" horiz-adv-x="1098" />
|
||||
|
||||
|
||||
<glyph glyph-name="dianpuxinxi" unicode="" d="M834.56 5.632H211.968c-20.992 0-26.624 12.288-26.624 35.328v247.808c0 14.848-12.288 26.624-26.624 26.624h-18.432c-14.848 0-26.624-12.288-26.624-26.624v-331.264c0-14.848 12.288-26.624 26.624-26.624H880.64c14.848 0 26.624 12.288 26.624 26.624V-20.48c0 14.848-12.288 26.624-26.624 26.624h-46.08v-0.512z m137.216 614.4c-7.168 25.6-14.848 41.472-22.016 67.072-43.008 84.48-62.464 130.56-104.96 155.136H186.368C146.944 827.904 114.176 772.608 98.304 737.28l-22.016-50.176C61.44 654.336 47.104 620.032 39.424 585.728c-7.168-41.472 0-84.48 14.848-117.248 29.184-67.072 86.528-108.544 144.384-117.248s129.536 25.6 165.888 84.48c36.864-50.176 86.528-84.48 144.384-84.48s108.544 32.768 144.384 84.48c43.008-67.072 122.368-101.376 187.904-75.776 73.216 15.872 168.448 102.4 130.56 260.096z m-116.224-168.448c-36.864-25.6-94.208-16.896-122.368 8.704-29.184 26.624-44.032 70.656-45.056 113.664 0 15.872-13.312 29.184-30.72 29.184h-6.144c-16.896 0-30.72-13.312-30.72-30.72 0-50.176-25.6-100.352-60.928-120.832-50.176-34.304-116.224-8.704-144.384 41.472-10.752 24.576-13.312 52.736-14.848 79.36 0 15.872-13.312 29.184-30.72 29.184H358.4c-15.872 0-29.184-13.312-30.72-29.184-1.024-29.184-5.12-54.784-20.992-79.36-22.016-50.176-86.528-75.776-129.536-50.176S105.472 536.064 112.64 594.432c7.168 25.6 16.896 48.64 29.184 75.776 46.592 104.96 70.656 108.544 70.656 108.544h593.92c41.472-18.432 40.448-50.176 73.216-114.688 13.312-28.16 23.04-48.64 26.624-76.8v-25.6c0.512-43.008-21.504-84.48-50.688-110.08z m10.752-189.44h-253.952c-14.848 0-26.624 12.288-26.624 26.624s12.288 26.624 26.624 26.624h253.952c14.848 0 26.624-12.288 26.624-26.624s-11.776-26.624-26.624-26.624z m-2.048-97.792h-186.88c-14.848 0-26.624 12.288-26.624 26.624 0 14.848 12.288 26.624 26.624 26.624h185.856c14.848 0 26.624-12.288 26.624-26.624 1.024-14.336-11.264-26.624-25.6-26.624z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="weibiaoti-_huaban" unicode="" d="M139.81696 337.79712v122.88h40.96v-122.88zM713.25696 337.79712v122.88h40.96v-122.88zM282.624 220.16c0-67.584-55.296-122.88-122.88-122.88s-122.88 55.296-122.88 122.88 55.296 122.88 122.88 122.88 122.88-55.296 122.88-122.88z m-122.88 81.92c-45.056 0-81.92-36.864-81.92-81.92s36.864-81.92 81.92-81.92 81.92 36.864 81.92 81.92-36.864 81.92-81.92 81.92zM856.064 220.16c0-67.584-55.296-122.88-122.88-122.88s-122.88 55.296-122.88 122.88 55.296 122.88 122.88 122.88 122.88-55.296 122.88-122.88z m-122.88 81.92c-45.056 0-81.92-36.864-81.92-81.92s36.864-81.92 81.92-81.92 81.92 36.864 81.92 81.92-36.864 81.92-81.92 81.92zM550.912-89.088h-122.88c-16.384 0-30.72 14.336-30.72 30.72s14.336 30.72 30.72 30.72h122.88c16.384 0 30.72-14.336 30.72-30.72 0-18.432-14.336-30.72-30.72-30.72zM753.664 101.376h-40.96c0-79.872-63.488-143.36-143.36-143.36v-40.96c102.4 0 184.32 83.968 184.32 184.32zM139.264 459.776h40.96c0 122.88 81.92 225.28 194.56 256 2.048 16.384 6.144 30.72 12.288 45.056C245.76 734.208 139.264 609.28 139.264 459.776zM712.704 459.776h40.96c0 24.576-2.048 47.104-8.192 69.632h-43.008c6.144-20.48 10.24-45.056 10.24-69.632zM823.296 529.408h-286.72c-90.112 0-163.84 73.728-163.84 163.84s73.728 163.84 163.84 163.84h286.72c90.112 0 163.84-73.728 163.84-163.84s-73.728-163.84-163.84-163.84z m122.88 163.84c0 67.584-55.296 122.88-122.88 122.88h-286.72c-67.584 0-122.88-55.296-122.88-122.88s55.296-122.88 122.88-122.88h286.72c67.584 0 122.88 55.296 122.88 122.88zM567.296 693.248m-30.72 0a30.72 30.72 0 1 1 61.44 0 30.72 30.72 0 1 1-61.44 0ZM679.936 693.248m-30.72 0a30.72 30.72 0 1 1 61.44 0 30.72 30.72 0 1 1-61.44 0ZM792.576 693.248m-30.72 0a30.72 30.72 0 1 1 61.44 0 30.72 30.72 0 1 1-61.44 0Z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="kanjia" unicode="" d="M206.848 193.536l-153.6 153.6c-16.384 16.384-24.576 36.864-24.576 61.44V697.344c0 30.72 24.576 57.344 57.344 57.344h288.768c22.528 0 43.008-8.192 59.392-24.576l153.6-153.6-40.96-40.96-153.6 153.6c-6.144 6.144-12.288 8.192-20.48 8.192H83.968v-288.768c0-8.192 2.048-14.336 8.192-20.48l153.6-153.6-38.912-40.96z m473.088-270.336c-22.528 0-43.008 8.192-59.392 24.576L405.504 164.864l40.96 40.96 215.04-215.04c10.24-10.24 28.672-10.24 40.96 0L962.56 250.88c10.24 10.24 10.24 28.672 0 40.96L743.424 506.88l40.96 40.96 215.04-215.04c32.768-32.768 32.768-88.064 0-120.832L739.328-50.176c-16.384-18.432-38.912-26.624-59.392-26.624zM57.344-128L0-70.656 1021.952 896 57.344-128z m112.64 681.984c0-30.72 24.576-57.344 57.344-57.344 30.72 0 57.344 24.576 57.344 57.344 0 30.72-24.576 57.344-57.344 57.344-32.768 0-57.344-24.576-57.344-57.344z m0 0" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="baomingbiaodan" unicode="" d="M866.156339 895.709704a45.20689 45.20689 0 0 0 50.322238-44.887181v-255.767411a45.20689 45.20689 0 0 0-90.41378 0V805.679575H103.266092v-842.36997H283.901827a45.270832 45.270832 0 0 0 31.970926-77.113874 45.270832 45.270832 0 0 0-31.970926-13.235964H57.995261a45.20689 45.20689 0 0 0-44.951123 50.258297V850.822523a45.015064 45.015064 0 0 0 14.898452 30.052671 45.142948 45.142948 0 0 0 30.052671 14.83451h808.22502z m-310.117986-844.927644v-87.600338h87.344571l283.646059 283.582117-87.856106 87.536397-283.070583-283.518176z m-90.030129 23.658486a45.015064 45.015064 0 0 0 12.980196 27.175287l327.701996 327.82988a44.951123 44.951123 0 0 0 45.334774 11.189824c7.481197-1.982197 14.514801-5.88265 20.397451-11.765301l150.199412-150.007587c9.591278-9.591278 13.939324-22.379649 13.10808-34.976193a44.887181 44.887181 0 0 0-13.10808-29.221427l-327.701996-327.82988a45.079006 45.079006 0 0 0-22.187823-12.148952 45.334774 45.334774 0 0 0-12.532603-1.790372H509.744451a45.20689 45.20689 0 0 0-44.119878 55.309703V68.557895c0 1.982197 0.127884 3.900453 0.383651 5.754767z m284.924896 535.704843c0-24.937323-20.269567-45.142948-45.20689-45.142948H223.796485a45.270832 45.270832 0 1 0 0 90.030129h481.546094a45.270832 45.270832 0 0 0 45.526599-44.887181zM600.158231 399.3291a45.20689 45.20689 0 0 0-45.20689-44.887181H223.860427a45.270832 45.270832 0 1 0 0 90.094071h331.090914c24.937323 0 45.20689-20.269567 45.20689-45.20689zM389.405884 188.83252c0-24.937323-20.269567-45.20689-45.20689-45.20689H223.796485a45.20689 45.20689 0 1 0 0 90.349839h120.338567c24.937323 0 45.20689-20.205626 45.20689-45.142949z" horiz-adv-x="1087" />
|
||||
|
||||
|
||||
<glyph glyph-name="zhishizhuanlan" unicode="" d="M878.592 626.688c-57.344 12.288-112.64 17.408-162.816 17.408-72.704 0-138.24-12.288-196.608-36.864l-4.096-2.048-4.096 2.048c-57.344 24.576-123.904 36.864-196.608 36.864-50.176 0-105.472-6.144-162.816-17.408-5.12-1.024-9.216-6.144-9.216-11.264V46.08c0-3.072 2.048-7.168 5.12-9.216 2.048-2.048 4.096-2.048 7.168-2.048 1.024 0 2.048 0 3.072 1.024 69.632 21.504 135.168 31.744 194.56 31.744 58.368 0 111.616-10.24 158.72-31.744 1.024-1.024 3.072-1.024 5.12-1.024s3.072 0 5.12 1.024c47.104 20.48 100.352 31.744 158.72 31.744 58.368 0 123.904-11.264 194.56-31.744 1.024 0 2.048-1.024 3.072-1.024 2.048 0 5.12 1.024 7.168 2.048 3.072 2.048 4.096 5.12 4.096 9.216V615.424c-1.024 5.12-4.096 10.24-10.24 11.264zM505.856 62.464c-46.08 18.432-98.304 27.648-153.6 27.648-53.248 0-110.592-8.192-172.032-24.576l-14.336-4.096V606.208l9.216 2.048c49.152 9.216 96.256 13.312 140.288 13.312 70.656 0 135.168-12.288 190.464-35.84v-523.264z m359.424-1.024l-14.336 4.096c-61.44 16.384-119.808 24.576-173.056 24.576-54.272 0-105.472-9.216-150.528-26.624V586.752c55.296 23.552 117.76 34.816 187.392 34.816 44.032 0 91.136-5.12 140.288-13.312l9.216-2.048v-544.768zM335.872 440.32h-20.48c-22.528 0-45.056-1.024-67.584-3.072-6.144-1.024-10.24-6.144-10.24-12.288s5.12-10.24 11.264-10.24h1.024c22.528 2.048 45.056 3.072 66.56 3.072h18.432c6.144 0 11.264 5.12 11.264 11.264 0 6.144-5.12 11.264-10.24 11.264z m93.184 79.872c-35.84 7.168-73.728 11.264-113.664 11.264-21.504 0-45.056-1.024-67.584-3.072-6.144-1.024-10.24-6.144-9.216-12.288 0-6.144 5.12-10.24 11.264-10.24 22.528 2.048 45.056 3.072 65.536 3.072 38.912 0 74.752-3.072 108.544-10.24h2.048c5.12 0 10.24 4.096 11.264 9.216 1.024 5.12-2.048 11.264-8.192 12.288z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="shangpinsousuo" unicode="" d="M307.2-128H46.545455a46.545455 46.545455 0 0 0-46.545455 46.545455v260.654545h101.981091v-205.218909H307.2V-128z m409.6 922.018909V896H977.454545a46.545455 46.545455 0 0 0 46.545455-46.545455v-260.654545h-101.981091V794.018909H716.8z m-409.6 0H101.981091V588.8H0V849.454545a46.545455 46.545455 0 0 0 46.545455 46.545455h260.654545v-101.981091zM1008.686545-112.686545a52.130909 52.130909 0 0 0-73.774545 0l-164.398545 164.398545a365.428364 365.428364 0 1 0 73.774545 73.774545l164.398545-164.398545a52.130909 52.130909 0 0 0 0-73.774545c0.093091 0 0 0 0 0zM737.186909 527.965091a261.026909 261.026909 0 1 1-369.152-369.152 261.026909 261.026909 0 1 1 369.152 369.105454z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="Component-fuzhufenge" unicode="" d="M967.68 619.52V788.48h-166.4V742.4H225.28V788.48H56.32v-166.4H102.4v-499.2H56.32v-166.4h166.4V0h576v-46.08h166.4v166.4H921.6V619.52h46.08z m-128 128h89.6v-89.6h-89.6V747.52z m-742.4 0h89.6v-89.6H97.28V747.52z m87.04-752.64H97.28v89.6h89.6v-89.6z m742.4 0h-89.6v89.6h89.6v-89.6z m-58.88 161.28v-35.84h-66.56v-66.56H225.28v66.56H156.16V619.52h66.56V686.08h576v-66.56h66.56v-463.36z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="xianshizhekou" unicode="" d="M45.070423 611.15493c-3.605634 0-10.816901 0-14.422536 3.605633-18.028169 10.816901-25.239437 32.450704-18.028169 50.478874C63.098592 769.802817 149.633803 849.126761 257.802817 892.394366c18.028169 7.211268 39.661972 0 46.873239-21.633803 7.211268-18.028169 0-39.661972-21.633802-46.873239-86.535211-36.056338-162.253521-104.56338-205.521127-191.098592-3.605634-14.422535-18.028169-21.633803-32.450704-21.633802zM978.929577 611.15493c-14.422535 0-25.239437 7.211268-32.450704 21.633802C903.211268 719.323944 831.098592 787.830986 740.957746 823.887324c-18.028169 7.211268-28.84507 28.84507-21.633802 46.873239 7.211268 18.028169 28.84507 28.84507 46.873239 21.633803 108.169014-43.267606 194.704225-122.591549 245.183099-227.154929 7.211268-18.028169 0-39.661972-18.028169-46.87324-3.605634-3.605634-10.816901-7.211268-14.422536-7.211267zM513.802817-109.971831c-259.605634 0-468.732394 209.126761-468.732394 465.126761S254.197183 823.887324 513.802817 823.887324s465.126761-209.126761 465.12676-468.732394-209.126761-465.126761-465.12676-465.126761z m0 861.746479c-219.943662 0-396.619718-176.676056-396.619718-396.619718s176.676056-393.014085 393.014084-393.014085 396.619718 176.676056 396.619718 393.014085S730.140845 751.774648 513.802817 751.774648zM578.704225 593.126761l-209.12676-245.183099c-7.211268-7.211268 0-21.633803 10.816901-21.633803h86.535211c7.211268 0 14.422535-7.211268 10.816902-14.422535l-32.450704-151.43662c-3.605634-14.422535 14.422535-21.633803 21.633802-10.816901l209.126761 241.577465c7.211268 7.211268 0 21.633803-10.816901 21.633802H578.704225c-7.211268 0-14.422535 7.211268-10.816901 14.422536l36.056338 155.042253c0 14.422535-18.028169 21.633803-25.239437 10.816902zM142.422535-128c-7.211268 0-14.422535 3.605634-21.633803 7.211268-14.422535 10.816901-18.028169 36.056338-7.211267 50.478873l90.140845 118.985915c10.816901 14.422535 36.056338 18.028169 50.478873 7.211268 14.422535-10.816901 18.028169-36.056338 7.211268-50.478873L171.267606-113.577465c-7.211268-10.816901-18.028169-14.422535-28.845071-14.422535zM881.577465-128c-10.816901 0-21.633803 3.605634-28.845071 14.422535l-90.140845 118.985916c-10.816901 14.422535-7.211268 39.661972 7.211268 50.478873 14.422535 10.816901 39.661972 7.211268 50.478873-7.211268l90.140845-118.985915c10.816901-14.422535 7.211268-39.661972-7.211267-50.478873-7.211268-7.211268-14.422535-7.211268-21.633803-7.211268z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="gonggao" unicode="" d="M825.6 735.4368a26.88 26.88 0 0 1-36.0704-11.1872 26.0352 26.0352 0 0 1 11.392-35.456C919.5008 628.224 944.896 498.5088 944.896 358.4c0-144.8448-29.0816-276.352-153.3184-335.0272-13.312-6.2976-18.9184-21.9904-12.4928-35.072a26.752 26.752 0 0 1 35.6608-12.3392C957.3888 43.3664 998.4 193.4848 998.4 358.4256c0 159.5136-36.7872 307.4816-172.8 377.0112z m-97.3824-127.6416a27.0336 27.0336 0 0 1-37.5808-4.0704 25.984 25.984 0 0 1 4.1216-36.992c74.752-59.0336 66.432-118.7072 66.432-208.3584 0-92.6208 5.9648-128.512-72.9344-187.8272-11.7248-8.8064-13.9776-25.344-5.0432-36.864a26.9056 26.9056 0 0 1 37.4784-4.9152c79.4368 69.3248 93.952 120.4992 93.952 229.632 0.0256 105.6512 1.0496 180.2752-86.4256 249.3952zM512-8.8064c0-7.04-11.52-10.0352-16.6912-13.312a13.5424 13.5424 0 0 0-16.2048 1.152l-237.696 193.792H129.8944c-42.1888 0-76.416 33.664-76.416 75.1616v197.376c0 41.472 34.2272 75.136 76.416 75.136H212.736l266.368 217.1904a13.824 13.824 0 0 0 8.8576 3.2768c2.5088 0 5.0176-0.7424 7.3472-2.176 5.1456-3.2512 16.6912-6.144 16.6912-13.184v-734.4128zM524.1856 783.104A67.9936 67.9936 0 0 1 487.9616 793.6c-15.616 0-30.9248-5.4784-43.0848-15.4368l-251.392-205.0304H129.8688C58.2656 573.1072 0 515.7888 0 445.3632v-197.3504c0-70.4512 58.2656-127.744 129.8944-127.744h92.2368l222.8224-181.6832c11.52-9.728 27.008-15.4112 42.9568-15.4112 12.5696 0 24.8832 3.5072 35.6352 10.112 21.248 13.3888 39.6032 51.456 39.6032 76.416V733.0304C563.2 758.016 544.8448 770.0736 524.1856 783.104z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="gexinghuatuijian" unicode="" d="M885.76 552.96v1.024 2.56l-1.536 8.704v0.512c-5.632 15.872-15.36 25.6-22.528 32.768l-5.12 5.12c-5.12 6.144-11.264 11.776-16.896 16.896l-0.512 0.512c-4.608 4.096-8.704 8.192-13.824 13.312L701.44 755.2l-1.536 1.536c-6.144 6.144-13.824 14.336-25.088 19.968-12.288 6.656-27.136 8.192-46.08 8.192h-37.888c-11.776 0-14.848 0-16.896-0.512-4.608-0.512-12.8-3.584-14.848-4.096l-1.024-0.512-16.384-10.752-0.512-0.512c-7.68-5.632-12.8-12.8-15.872-16.896l-0.512-1.024c-1.024-1.536-2.048-3.072-3.072-3.584-12.288-9.728-20.48-12.288-44.544-17.408h-0.512c-3.584-1.024-6.144-1.024-7.68-1.024l-14.848 0.512c-12.8 2.56-22.016 4.608-30.72 8.192-6.656 2.56-13.312 7.68-15.36 10.24l-1.024 1.536c-4.608 6.656-10.752 13.824-19.456 20.48-6.656 5.12-19.456 12.288-27.648 13.824-6.144 1.024-15.872 2.048-28.672 2.048-20.992 0-44.544-1.536-46.08-1.536L262.656 778.24h-0.512c-14.848-5.632-24.576-15.872-31.232-22.528l-130.56-128c-4.096-3.584-7.168-6.656-10.752-10.24-2.56-2.56-5.632-5.632-9.216-8.704-11.776-10.24-29.184-25.088-34.816-53.76-3.072-16.384 3.072-31.232 6.656-38.4 6.144-13.312 14.848-22.016 22.016-28.672l2.048-1.536c1.024-0.512 2.048-2.048 3.072-3.072l4.608-4.608 13.312-13.312 17.408-17.408 29.696-28.672 9.216-9.216 1.024-1.024 0.512-0.512c3.072-3.072 7.168-7.168 12.8-11.264l0.512-0.512c12.8-8.704 28.672-13.312 43.008-13.312 5.632 0 10.752 0.512 15.36 1.536v-264.192c0-10.752 0-23.04 4.608-34.816 6.144-16.384 19.456-28.672 28.672-34.304 15.36-9.728 33.792-11.264 51.712-11.264h276.48l25.088-0.512c20.992 0 45.056 1.024 64 15.36 12.288 9.216 22.016 24.576 25.6 41.472l0.512 5.12v0.512c0.512 25.088 0.512 49.664 0.512 75.776V386.048c9.728-2.56 19.968-3.072 30.72-1.024 26.624 5.12 43.52 25.088 52.736 35.328L866.816 496.64l3.072 4.096c5.632 7.168 19.456 25.6 15.872 52.224z m-244.736-94.208v-350.208c-0.512-1.024-1.536-2.048-1.024-2.048-2.56-1.536-12.288-2.56-25.6-2.56l-285.696 0.512-15.872-0.512c-12.288 0-16.384 1.024-16.896 1.536-1.024 0.512-2.56 2.048-3.072 3.072-0.512 3.072-0.512 10.752-0.512 14.848V459.264l-43.008 25.088-6.656-7.68c-3.072-3.584-12.8-14.336-15.36-16.896-5.632-6.144-10.24-10.24-14.336-12.288-1.536 0-5.12 1.024-6.656 2.048l-1.024 1.024c-0.512 0-1.536 1.024-3.584 3.584l-2.048 2.048-38.912 37.888c-5.632 5.12-10.752 10.24-15.872 15.872l-3.072 2.048c-2.56 2.048-5.12 4.608-7.68 7.68l-3.072 3.072-5.632 5.632c-2.048 2.048-4.096 4.096-6.656 6.144-5.12 4.096-6.656 6.144-7.168 7.68-0.512 1.024-0.512 2.048-1.536 3.584 1.024 4.096 4.608 7.168 14.336 16.384l10.752 10.752c1.024 1.024 2.048 2.048 3.584 3.072l0.512 0.512c1.536 1.536 3.072 3.072 5.12 4.608l108.544 105.984 24.064 23.552c7.168 7.68 8.192 7.68 10.752 7.68l11.264 1.024H347.136l2.048-1.024c0.512 0 1.024-0.512 1.024-0.512 2.048-2.048 4.096-4.608 6.656-7.68l1.536-2.048c13.312-16.896 34.816-27.136 41.472-29.696 12.8-5.12 26.112-8.704 45.056-12.288l14.336-1.536c7.68-1.536 17.92-1.024 31.232 1.536 30.208 5.632 49.152 11.776 72.704 30.72 6.656 5.12 10.752 10.24 14.336 15.36 1.024 1.024 1.536 2.048 2.56 3.072l1.024 1.024 4.608 2.56h0.512c0.512 0 1.536 0.512 2.56 0.512h28.16c4.608 0.512 8.704 0.512 13.824 0.512 9.728 0 14.336-0.512 16.384-1.024 3.072-2.048 7.168-6.144 10.752-9.728l122.368-119.296c5.12-5.12 10.24-10.24 16.384-15.872 3.072-3.072 9.216-8.704 14.336-13.824l5.632-5.632 0.512-0.512c3.072-2.56 4.608-4.608 6.144-6.144l0.512-3.072v-0.512c0-0.512-0.512-1.536-2.56-3.584l-76.8-74.752-4.096-4.608c-4.608-5.12-11.776-12.8-15.872-13.824-3.584-1.024-6.144 0.512-15.872 9.728l-28.672 27.648-38.912-26.112z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="dianpubijikapian" unicode="" d="M824.32-9.728H219.648c-28.672 0-52.224 25.088-52.224 55.808V721.92c0 30.72 23.552 55.808 52.224 55.808h482.816c19.456 0 34.816-15.36 34.816-34.816s-15.36-34.816-34.816-34.816H232.448v-648.192h578.56V517.632c0 17.92 14.848 32.768 32.768 32.768 17.92 0 32.768-14.848 32.768-32.768V46.08c0-31.232-23.552-55.808-52.224-55.808zM764.928 678.4l51.712-39.936-226.304-292.352-51.712 39.936 226.304 292.352zM520.704 363.52l-10.752-67.584 62.464 27.648-51.712 39.936zM837.12 665.6l34.816 45.056c11.776 15.36 9.728 36.352-4.608 47.616s-35.328 7.68-47.104-7.68l-34.816-45.056 51.712-39.936zM483.328 542.208H311.808c-14.336 0-26.112 11.776-26.112 26.112v4.096c0 14.336 11.776 26.112 26.112 26.112h172.032c14.336 0 26.112-11.776 26.112-26.112v-4.096c0-14.848-11.776-26.112-26.624-26.112zM483.328 394.24H311.808c-14.336 0-26.112 11.776-26.112 26.112v4.096c0 14.336 11.776 26.112 26.112 26.112h172.032c14.336 0 26.112-11.776 26.112-26.112v-4.096c0-14.336-11.776-26.112-26.624-26.112z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="zhishifufeihuiyuan" unicode="" d="M680.96 109.056c51.2 2.048 95.232 36.864 110.08 86.016 24.064 90.112 46.592 181.76 68.096 272.896 4.096 19.968-1.024 41.472-14.336 58.88-12.8 17.408-32.256 28.16-52.224 30.208h-0.512c-30.72 2.048-67.072-19.456-99.328-37.888-22.016-12.8-49.152-28.672-58.88-25.6-1.024 0-1.536 0.512-2.56 2.56-18.944 42.496-32.256 88.064-45.568 132.096-8.704 28.16-17.408 57.856-27.648 86.528-10.752 27.136-37.376 44.032-68.608 44.032-31.744 0-59.392-17.408-70.144-44.032-13.312-37.888-26.112-76.8-38.4-114.688-10.752-33.792-22.016-68.608-33.792-102.4-1.536-3.584-3.072-4.608-4.608-5.12-13.312-4.608-48.64 16.384-76.8 33.792-13.824 8.192-27.648 16.896-41.472 24.064-24.576 11.776-53.248 8.192-76.288-9.728-23.552-17.92-34.816-45.568-29.696-72.192 21.504-90.624 44.032-182.272 68.096-272.896 14.848-49.152 58.88-83.456 110.08-86.016M797.696 481.28c-17.92-92.672-43.008-184.832-67.584-270.848-7.168-22.016-26.624-37.376-49.152-38.4-127.488-4.096-256.512-4.096-383.488 0-23.04 1.536-42.496 16.384-49.664 38.4C223.232 296.96 198.144 388.608 180.224 481.28v1.024c0 3.072 1.024 6.144 3.072 8.704 2.048 2.56 5.12 3.584 7.68 3.584 8.192 0 35.84-16.384 58.368-29.696 18.432-10.752 36.864-22.016 55.296-30.72 18.432-8.192 39.936-8.704 59.392-0.512 19.456 8.192 34.816 23.552 41.984 42.496 10.24 28.672 18.944 58.368 28.16 86.528 13.312 43.008 27.136 88.064 44.032 130.048 1.536 4.096 5.632 6.656 9.728 6.656h0.512c4.608 0 8.192-2.56 9.728-6.656 14.848-37.376 27.136-77.312 38.912-115.2 10.24-34.304 21.504-69.632 34.304-103.936 12.8-30.72 45.056-50.176 77.824-46.08 24.576 3.072 52.224 19.968 81.92 37.376 16.384 10.24 33.792 20.48 50.176 28.16 5.12 2.048 9.728-1.024 10.752-2.048 3.072-1.536 6.144-5.632 5.632-9.728zM132.096 543.232l6.144 4.096 7.168 7.168 5.632 8.704 4.096 9.728 2.048 9.728 0.512 8.192-1.024 7.68-2.048 7.68-4.096 9.216-7.68 10.24-6.144 5.12-6.656 4.096-9.216 4.096-9.728 2.048-8.704 0.512-7.68-1.024-7.68-2.048-9.216-4.608-10.24-7.68-5.12-5.632-4.096-6.656-4.096-9.728-2.048-9.728-0.512-8.192 0.512-3.072 2.048-9.728 3.584-9.216 3.072-5.12 6.144-7.68 5.632-5.12 6.656-4.096 9.728-4.096 9.728-2.048 8.704-0.512 7.68 1.024 7.68 2.048zM438.272 807.936l3.584-9.216 3.072-5.12 6.144-7.168 5.632-5.632 7.168-4.096 9.216-4.096 9.728-2.048 8.704-0.512 7.68 1.024 7.68 2.56 9.216 4.096 6.144 4.608 7.168 7.168 5.632 8.192 4.096 9.728 2.048 9.728 0.512 8.192-1.024 8.192-2.048 7.68-4.096 9.216-7.68 9.728-6.144 5.12-6.656 4.608-9.216 3.584-9.728 2.56H486.4l-7.68-1.024-7.68-2.048-9.216-4.096-10.24-7.68-5.12-6.144-4.096-6.656-4.096-9.216-2.048-9.728-0.512-8.704 0.512-2.56zM924.672 598.528l-2.048 8.192-4.096 8.704-7.68 10.24-6.144 5.12-6.656 4.096-9.216 4.096-9.728 2.048-8.704 0.512-7.68-1.024-7.68-2.048-9.216-4.608-10.24-7.68-5.12-5.632-4.096-6.656-4.096-9.216-2.048-10.24-0.512-8.192 0.512-2.56 2.048-10.24 3.584-9.216 3.072-5.12 6.144-7.68 5.632-5.12 6.656-4.096 9.728-4.096 9.728-2.048 8.704-0.512 7.68 1.024 7.68 2.048 9.216 4.608 6.144 4.096 7.168 7.168 5.632 8.704 4.096 9.216 2.048 10.24 0.512 8.192zM731.648 31.232H248.832c-16.896 0-30.72 13.824-30.72 30.72s13.824 30.72 30.72 30.72h482.816c16.896 0 30.72-13.824 30.72-30.72s-13.824-30.72-30.72-30.72z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="zhishizhuanlan1" unicode="" d="M857.088 225.28c-3.584 12.8-8.192 23.552-12.288 31.232 18.944 32.768 22.016 69.12 8.192 104.96-4.096 11.264-9.728 20.48-13.824 27.648 27.136 45.568 23.552 84.48 15.36 109.568-9.216 28.16-25.6 44.544-28.672 47.616l-4.096 4.096-281.6 98.816-3.072 1.024-360.448-91.648 328.704-178.688L798.72 491.008c1.536-3.072 2.56-6.144 4.096-9.216 6.656-19.968 3.584-40.96-9.216-62.976l-283.136-101.888-266.24 148.48c-4.096 2.048-8.704 3.584-13.312 3.584-9.728 0-18.944-5.632-24.064-13.824-3.584-6.144-4.608-13.824-2.56-20.992 2.048-7.168 6.656-12.8 12.8-16.384l288.256-160.768 287.232 103.424c3.072-5.12 6.656-11.264 9.728-18.944 7.168-19.968 6.144-37.888-3.584-55.808l-288.256-98.304-266.24 149.504c-4.096 2.048-8.704 3.584-13.312 3.584-9.728 0-18.944-5.12-24.064-13.824-7.168-13.312-2.56-29.696 10.752-37.376L505.344 128l293.376 100.352c2.048-4.608 4.608-10.24 6.144-16.896 5.12-19.968 2.56-40.448-6.656-61.44L512 55.808 243.712 204.8c-4.096 2.048-8.704 3.584-13.312 3.584-9.728 0-18.944-5.632-24.064-14.336-3.584-6.144-4.608-13.824-2.56-20.992 2.048-7.168 6.656-12.8 13.312-16.384l289.28-160.256 330.24 108.032 5.12 9.728c24.576 45.568 22.016 85.504 15.36 111.104z m-125.952 299.008L509.44 439.808l-31.232 16.896 225.28 76.8 27.648-9.216z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="daka" unicode="" d="M166.4 793.6a51.2 51.2 0 1 0 0-102.4H153.6a51.2 51.2 0 0 1-51.2-51.2v-614.4a51.2 51.2 0 0 1 51.2-51.2h716.8a51.2 51.2 0 0 1 51.2 51.2V640a51.2 51.2 0 0 1-51.2 51.2h-12.8a51.2 51.2 0 1 0 0 102.4h12.8a153.6 153.6 0 0 0 153.6-153.6v-614.4a153.6 153.6 0 0 0-153.6-153.6H153.6a153.6 153.6 0 0 0-153.6 153.6V640a153.6 153.6 0 0 0 153.6 153.6z m279.552-652.7488l-2.7392 0.1792a51.5328 51.5328 0 0 0-24.3712 8.8576l-0.6912 0.512a47.0272 47.0272 0 0 0-6.3488 5.376l2.7392-2.56a51.072 51.072 0 0 0-1.8944 1.7408l-0.8448 0.8448-179.2 179.2a51.2 51.2 0 0 0 72.3968 72.3968l146.7904-146.7648 284.2368 227.328a51.2 51.2 0 1 0 63.9488-79.9488l-320-256-1.4848-1.152a51.072 51.072 0 0 0-1.2288-0.896l2.7136 2.048a51.712 51.712 0 0 0-21.248-10.0864l-0.512-0.1024a46.08 46.08 0 0 0-8.0128-0.9728h-4.2752zM307.2 896a51.2 51.2 0 0 0 51.2-51.2v-179.2a51.2 51.2 0 1 0-102.4 0V844.8a51.2 51.2 0 0 0 51.2 51.2z m409.6 0a51.2 51.2 0 0 0 51.2-51.2v-179.2a51.2 51.2 0 1 0-102.4 0V844.8a51.2 51.2 0 0 0 51.2 51.2z m-153.6-102.4a51.2 51.2 0 1 0 0-102.4h-102.4a51.2 51.2 0 1 0 0 102.4z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="mofang" unicode="" d="M532.573383 224.811627v-204.274722h350.185238v204.274722z m291.821031-145.910516h-233.456825v87.54631h233.456825zM532.573383 720.907381v-437.731547h350.185238V720.907381z m291.821031-379.367341h-233.456825V662.543175h233.456825zM124.023938 458.268453v-437.731548h350.185238V458.268453z m291.821032-379.367342h-233.456825V399.904246h233.456825zM124.023938 720.907381v-204.274722h350.185238V720.907381z m291.821032-145.910516h-233.456825V662.543175h233.456825z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="jinrudianpu" unicode="" d="M266.778947 295.073684c-24.252632 0-45.810526 5.389474-64.673684 10.778948-59.284211 21.557895-107.789474 80.842105-129.347368 161.68421C37.726316 599.578947 80.842105 750.484211 185.936842 869.052632 191.326316 877.136842 202.105263 882.526316 215.578947 882.526316h665.6c26.947368 0 48.505263-13.473684 59.284211-37.726316 97.010526-194.021053 129.347368-328.757895 97.010526-414.989474-13.473684-37.726316-43.115789-67.368421-80.842105-83.536842-123.957895-51.2-207.494737-21.557895-258.694737 26.947369-48.505263-45.810526-99.705263-70.063158-156.294737-70.063158-37.726316 0-86.231579 10.778947-129.347368 61.978947-48.505263-53.894737-99.705263-70.063158-145.51579-70.063158zM234.442105 801.684211c-78.147368-97.010526-110.484211-212.884211-83.536842-312.589474 13.473684-53.894737 43.115789-94.315789 78.147369-107.789474 35.031579-13.473684 91.621053-18.863158 156.294736 75.452632 8.084211 10.778947 21.557895 18.863158 35.031579 16.168421 13.473684 0 26.947368-10.778947 32.336842-21.557895 29.642105-59.284211 64.673684-67.368421 88.926316-67.368421 40.421053 0 83.536842 24.252632 123.957895 75.452632 8.084211 10.778947 18.863158 16.168421 32.336842 13.473684 13.473684 0 24.252632-5.389474 32.336842-16.168421 29.642105-40.421053 83.536842-86.231579 196.71579-37.726316 18.863158 8.084211 29.642105 18.863158 37.726315 37.726316 16.168421 43.115789 13.473684 134.736842-88.926315 342.231579-231.747368 2.694737-447.326316 2.694737-641.347369 2.694737zM935.073684-114.526316h-700.631579c-8.084211 0-16.168421 2.694737-21.557894 5.389474-35.031579 21.557895-75.452632 67.368421-75.452632 153.6 0 21.557895 18.863158 40.421053 40.421053 40.421053s40.421053-18.863158 40.421052-40.421053c0-45.810526 13.473684-67.368421 29.642105-80.842105h649.431579V381.305263c0 21.557895 18.863158 40.421053 40.421053 40.421053s40.421053-18.863158 40.421053-40.421053V-74.105263c-2.694737-21.557895-18.863158-40.421053-43.11579-40.421053zM334.147368 44.463158c-10.778947 0-21.557895 5.389474-29.642105 13.473684-16.168421 16.168421-13.473684 43.115789 2.694737 56.589474l26.947368 24.252631H53.894737c-21.557895 0-40.421053 18.863158-40.421053 40.421053s18.863158 40.421053 40.421053 40.421053h382.652631c16.168421 0 32.336842-10.778947 37.726316-26.947369 5.389474-16.168421 2.694737-32.336842-10.778947-43.115789l-102.4-94.31579c-8.084211-5.389474-16.168421-10.778947-26.947369-10.778947z" horiz-adv-x="1050" />
|
||||
|
||||
|
||||
<glyph glyph-name="lunbotu" unicode="" d="M730.453333 59.733333H290.133333c-61.44 0-112.64 51.2-112.64 112.64V599.04c0 61.44 51.2 112.64 112.64 112.64h440.32c61.44 0 112.64-51.2 112.64-112.64v-426.666667c0-64.853333-51.2-112.64-112.64-112.64zM290.133333 680.96c-44.373333 0-81.92-37.546667-81.92-81.92v-426.666667c0-44.373333 37.546667-81.92 81.92-81.92h440.32c44.373333 0 81.92 37.546667 81.92 81.92V599.04c0 44.373333-37.546667 81.92-81.92 81.92H290.133333zM150.186667 158.72H71.68c-40.96 0-71.68 30.72-71.68 71.68v307.2c0 40.96 30.72 71.68 71.68 71.68h78.506667c6.826667 0 13.653333-6.826667 13.653333-13.653333s-6.826667-13.653333-13.653333-13.653334H71.68c-23.893333 0-40.96-20.48-40.96-40.96v-307.2c0-23.893333 20.48-40.96 40.96-40.96h78.506667c6.826667 0 13.653333-6.826667 13.653333-13.653333 0-13.653333-6.826667-20.48-13.653333-20.48zM952.32 158.72h-78.506667c-6.826667 0-13.653333 6.826667-13.653333 13.653333s6.826667 13.653333 13.653333 13.653334h78.506667c23.893333 0 40.96 20.48 40.96 40.96v307.2c0 23.893333-20.48 40.96-40.96 40.96h-78.506667c-6.826667 0-13.653333 6.826667-13.653333 13.653333s6.826667 13.653333 13.653333 13.653333h78.506667c40.96 0 71.68-30.72 71.68-71.68v-307.2c0-34.133333-30.72-64.853333-71.68-64.853333zM327.68 404.48c-51.2 0-92.16 40.96-92.16 92.16C235.52 544.426667 276.48 588.8 327.68 588.8c51.2 0 92.16-40.96 92.16-92.16 0-51.2-40.96-92.16-92.16-92.16z m0 153.6c-34.133333 0-61.44-27.306667-61.44-61.44s27.306667-61.44 61.44-61.44 61.44 27.306667 61.44 61.44-27.306667 61.44-61.44 61.44zM201.386667 182.613333l-17.066667 27.306667 194.56 129.706667 126.293333-75.093334 150.186667 235.52 184.32-245.76-23.893333-17.066666-160.426667 211.626666-139.946667-225.28-133.12 81.92z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="datuhengxianghuadong" unicode="" d="M51.2 691.2h716.8v-614.4H51.2V691.2z m179.2-307.2a76.8 76.8 0 1 1 0 153.6 76.8 76.8 0 0 1 0-153.6zM512 435.2l-153.6-204.8h307.2l-153.6 204.8zM870.4 691.2h102.4v-614.4h-102.4z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="xiaotuhengxianghuadong" unicode="" d="M51.2 588.8h358.4v-409.6H51.2zM512 588.8h204.8v-409.6h-204.8zM819.2 588.8h153.6v-409.6h-153.6z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="daohanghengxianghuadong" unicode="" d="M51.2 588.8h921.6v-409.6H51.2V588.8z m102.4-153.6v-102.4h153.6V435.2H153.6z m256 0v-102.4h204.8V435.2H409.6z m307.2 0v-102.4h153.6V435.2h-153.6z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="yihangyige" unicode="" d="M51.2 793.6h921.6v-614.4H51.2V793.6z m230.4-307.2a76.8 76.8 0 1 1 0 153.6 76.8 76.8 0 0 1 0-153.6zM614.4 588.8l-204.8-256h409.6l-204.8 256zM51.2 76.8h921.6v-102.4H51.2z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="icon_tupian_lunbohaibao" unicode="" d="M102.4 844.8h819.2c30.72 0 51.2-20.48 51.2-51.2v-665.6c0-30.72-20.48-51.2-51.2-51.2H102.4c-30.72 0-51.2 20.48-51.2 51.2V793.6c0 30.72 20.48 51.2 51.2 51.2z m512-256c-5.12 5.12-5.12 5.12 0 0-15.36 15.36-30.72 15.36-40.96 5.12l-312.32-307.2c-5.12-5.12-10.24-10.24-10.24-20.48 0-15.36 10.24-25.6 25.6-25.6h506.88c5.12 0 10.24 0 15.36 5.12 10.24 5.12 15.36 25.6 10.24 35.84L614.4 588.8zM281.6 537.6C322.56 537.6 358.4 573.44 358.4 614.4S322.56 691.2 281.6 691.2 204.8 655.36 204.8 614.4 240.64 537.6 281.6 537.6zM194.56 0h76.8c20.48 0 40.96-15.36 40.96-40.96s-20.48-35.84-46.08-35.84H194.56c-25.6 0-40.96 15.36-40.96 40.96s15.36 35.84 40.96 35.84z m276.48 0h76.8c20.48 0 40.96-15.36 40.96-40.96s-15.36-35.84-35.84-35.84H471.04c-20.48 0-40.96 15.36-40.96 40.96s20.48 35.84 40.96 35.84z m286.72 0h76.8c20.48 0 40.96-15.36 40.96-40.96s-20.48-35.84-46.08-35.84h-76.8c-20.48 0-40.96 15.36-40.96 40.96s20.48 35.84 46.08 35.84z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="sanjiaoxingzuo" unicode="" d="M155.2 327.5l621-424.4c45.3-31 106.9 1.5 106.9 56.4V808.4c0 54.9-61.5 87.4-106.9 56.4l-621-424.4c-39.7-27.2-39.7-85.8 0-112.9z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="juyou" unicode="" d="M72.704 691.2q-25.6 0-43.52 17.92t-17.92 43.52 17.92 43.52 43.52 17.92l675.84 0q25.6 0 43.52-17.92t17.92-43.52-17.92-43.52-43.52-17.92l-675.84 0zM748.544 568.32q25.6 0 43.52-17.92t17.92-43.52-17.92-43.52-43.52-17.92l-430.08 0q-25.6 0-43.52 17.92t-17.92 43.52 17.92 43.52 43.52 17.92l430.08 0zM748.544 322.56q25.6 0 43.52-17.92t17.92-43.52-17.92-43.52-43.52-17.92l-614.4 0q-25.6 0-43.52 17.92t-17.92 43.52 17.92 43.52 43.52 17.92l614.4 0zM748.544 76.8q25.6 0 43.52-17.92t17.92-43.52-17.92-43.52-43.52-17.92l-368.64 0q-25.6 0-43.52 17.92t-17.92 43.52 17.92 43.52 43.52 17.92l368.64 0z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="juzhong" unicode="" d="M772.713406 12.607567c19.455728 0 35.993096-6.911903 49.509707-20.786908 13.465411-13.823806 20.223717-30.565972 20.223717-50.072899 0-19.455728-6.758305-35.993096-20.223717-49.458508a67.327057 67.327057 0 0 0-49.509707-20.274916H210.340479c-19.455728 0-35.993096 6.758305-49.509707 20.274916a67.327057 67.327057 0 0 0-20.223716 49.458508c0 19.506927 6.758305 36.197893 20.223716 50.072899 13.516611 13.875006 30.00278 20.786909 49.509707 20.786908h562.372927z m140.593232 281.186464c19.455728 0 35.993096-6.911903 49.458507-20.786909 13.516611-13.823806 20.274916-30.565972 20.274917-50.072899 0-19.455728-6.758305-35.993096-20.274917-49.458508a67.275858 67.275858 0 0 0-49.458507-20.274916H69.747248c-19.455728 0-35.993096 6.758305-49.509707 20.274916A67.327057 67.327057 0 0 0 0.013824 222.934223c0 19.506927 6.758305 36.197893 20.223717 50.072899 13.516611 13.875006 30.00278 20.786909 49.509707 20.786909h843.55939z m-140.593232 280.060079c19.455728 0 35.993096-6.707106 49.509707-20.223717 13.465411-13.516611 20.223717-30.00278 20.223717-49.509707 0-19.455728-6.758305-36.146694-20.223717-50.021699a66.40547 66.40547 0 0 0-49.509707-20.838109H210.340479c-19.455728 0-35.993096 6.963103-49.509707 20.838109a69.221431 69.221431 0 0 0-20.223716 50.021699c0 19.506927 6.758305 35.993096 20.223716 49.509707 13.516611 13.516611 30.00278 20.223717 49.509707 20.223717h562.372927zM69.747248 714.498541c-19.455728 0-35.993096 6.911903-49.509707 20.786909A69.221431 69.221431 0 0 0 0.013824 785.30715c0 19.506927 6.758305 35.993096 20.223717 49.509707C33.805351 848.333467 50.240321 855.040573 69.747248 855.040573h843.55939c19.455728 0 35.993096-6.707106 49.458507-20.223716 13.516611-13.516611 20.274916-30.00278 20.274917-49.509707 0-19.455728-6.758305-36.146694-20.274917-50.0217-13.465411-13.875006-29.951581-20.786909-49.458507-20.786909H69.747248z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="horizontal-left" unicode="" d="M874.66666667 832.512q26.624 0 45.056-18.432t18.432-45.056-18.432-45.056-45.056-18.432l-704.512 0q-26.624 0-45.056 18.432t-18.432 45.056 18.432 45.056 45.056 18.432l704.512 0zM170.15466667 448.512q-26.624 0-45.056 18.432t-18.432 45.056 18.432 46.08 45.056 19.456l447.488 0q26.624 0 45.056-19.456t18.432-46.08-18.432-45.056-45.056-18.432l-447.488 0zM810.15466667 320.51199999999994q27.648 0 46.08-18.432t18.432-45.056-18.432-45.056-46.08-18.432l-640 0q-26.624 0-45.056 18.432t-18.432 45.056 18.432 45.056 45.056 18.432l640 0zM554.15466667 64.51199999999994q26.624 0 45.056-18.944t18.432-45.568-18.432-45.056-45.056-18.432l-384 0q-26.624 0-45.056 18.432t-18.432 45.056 18.432 45.568 45.056 18.944l384 0z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="wangye" unicode="" d="M787.2 793.6H236.8C140.8 793.6 64 716.8 64 620.8v-473.6c0-96 76.8-172.8 172.8-172.8h550.4c96 0 172.8 76.8 172.8 172.8V620.8c0 96-76.8 172.8-172.8 172.8z m-550.4-64h550.4c57.6 0 108.8-51.2 108.8-108.8v-57.6H128v57.6c0 57.6 51.2 108.8 108.8 108.8z m550.4-691.2H236.8c-57.6 0-108.8 51.2-108.8 108.8V499.2h768v-352c0-57.6-51.2-108.8-108.8-108.8zM512 371.2H236.8c-19.2 0-32-12.8-32-32s12.8-32 32-32H512c19.2 0 32 12.8 32 32s-12.8 32-32 32zM377.6 217.6H236.8c-19.2 0-32-12.8-32-32s12.8-32 32-32H384c19.2 0 32 12.8 32 32s-19.2 32-38.4 32zM243.2 633.6m-38.4 0a38.4 38.4 0 1 1 76.8 0 38.4 38.4 0 1 1-76.8 0ZM358.4 633.6m-38.4 0a38.4 38.4 0 1 1 76.8 0 38.4 38.4 0 1 1-76.8 0ZM467.2 633.6m-38.4 0a38.4 38.4 0 1 1 76.8 0 38.4 38.4 0 1 1-76.8 0Z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="zujian" unicode="" d="M924.444444 224.711111c-5.688889 0-11.377778 0-17.066666-2.844444L512 54.044444 116.622222 221.866667c-5.688889 2.844444-11.377778 2.844444-17.066666 2.844444-22.755556 0-42.666667-19.911111-42.666667-42.666667 0-17.066667 11.377778-34.133333 25.6-39.822222l412.444444-176.355555c11.377778-5.688889 22.755556-5.688889 31.288889 0L938.666667 142.222222c14.222222 5.688889 25.6 22.755556 25.6 39.822222 2.844444 22.755556-17.066667 42.666667-39.822223 42.666667z m0 190.577778c-8.533333 0-17.066667-2.844444-17.066666-2.844445L512 244.622222 116.622222 412.444444s-11.377778 2.844444-17.066666 2.844445c-22.755556 0-42.666667-19.911111-42.666667-42.666667 0-17.066667 11.377778-34.133333 25.6-39.822222L494.933333 156.444444c5.688889-2.844444 11.377778-2.844444 17.066667-2.844444 5.688889 0 11.377778 0 17.066667 2.844444l412.444444 176.355556c14.222222 5.688889 25.6 22.755556 25.6 39.822222 0 22.755556-19.911111 42.666667-42.666667 42.666667zM82.488889 523.377778l412.444444-176.355556c5.688889-2.844444 11.377778-2.844444 17.066667-2.844444 5.688889 0 11.377778 0 17.066667 2.844444l412.444444 176.355556c14.222222 5.688889 25.6 22.755556 25.6 39.822222 0 17.066667-11.377778 34.133333-25.6 39.822222L529.066667 779.377778c-11.377778 5.688889-22.755556 5.688889-31.288889 0L82.488889 603.022222c-14.222222-5.688889-25.6-22.755556-25.6-39.822222 0-19.911111 11.377778-34.133333 25.6-39.822222z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="goods" unicode="" d="M829.132 805.861h-634.334c-45.078 0-81.693-38.783-81.693-86.501v-671.722c0-47.73 36.631-86.5 81.693-86.5h634.405c45.063 0 81.693 38.77 81.693 86.5v671.779c-0.057 47.718-36.701 86.444-81.764 86.444zM765.634 547.385c-21.219-130.65-128.683-227.397-253.369-227.397-124.9 0-232.807 97.331-253.683 227.327-21.448 9.146-36.616 31.293-36.616 57.264 0 34.133 26.142 61.801 58.377 61.801 32.234 0 58.377-27.67 58.377-61.801 0-9.219-2.040-17.881-5.45-25.743-2.312-8.489-5.95-16.566-12.258-23.274 17.995-99.285 97.218-168.834 191.239-168.834 94.364 0 174.074 70.675 191.239 168.721-6.093 6.293-9.688 13.885-12.072 22.004-3.823 8.233-6.164 17.351-6.164 27.141 0 34.134 26.142 61.801 58.376 61.801 32.235 0 58.377-27.668 58.377-61.801 0.012-25.903-15.057-48.004-36.373-57.209z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="tupianguanggao" unicode="" d="M809.856 716.8H215.6288A49.4336 49.4336 0 0 1 166.144 667.4176V75.008c0-27.2896 22.1696-49.3824 49.5104-49.3824h594.2272a49.4592 49.4592 0 0 1 49.536 49.3824V667.392A49.4592 49.4592 0 0 1 809.856 716.8z m-192.4608-439.3984l-95.0528-82.304-142.6176 131.6608-142.6432-131.6608-21.4528-24.4224V667.392h594.2272V75.008l-192.4608 202.4192z m35.6608 95.232a92.544 92.544 0 0 1 92.5696 92.416 92.544 92.544 0 0 1-92.5696 92.4672 92.5184 92.5184 0 0 1-92.5952-92.4672 92.5184 92.5184 0 0 1 92.5952-92.416zM136.9088 649.4208H75.1104A49.4336 49.4336 0 0 1 25.6 600.0384v-454.8352c0-27.264 22.1696-49.3824 49.5104-49.3824h61.7984v49.3824H75.1104V600.0384h61.7984V649.4208z m750.1824-553.9072h61.7984A49.4592 49.4592 0 0 1 998.4 144.8704V599.7312a49.4592 49.4592 0 0 1-49.5104 49.3824h-61.7984v-49.3824h61.7984V144.896h-61.7984v-49.3568z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="icon_tupiandaohang" unicode="" d="M992 640H32c-19.2 0-32-12.8-32-32v-448c0-19.2 12.8-32 32-32h960c19.2 0 32 12.8 32 32v448c0 19.2-12.8 32-32 32z m-32-448H64V576h896v-384zM179.2 352h115.2c19.2 0 25.6 6.4 25.6 19.2V492.8c0 12.8-6.4 19.2-19.2 19.2H179.2c-12.8 0-19.2-6.4-19.2-19.2v-115.2c0-19.2 6.4-25.6 19.2-25.6zM454.4 352h115.2c12.8 0 19.2 6.4 19.2 19.2V492.8c6.4 12.8-6.4 19.2-19.2 19.2H454.4c-12.8 0-19.2-6.4-19.2-19.2v-115.2c0-19.2 6.4-25.6 19.2-25.6zM723.2 352h115.2c12.8 0 19.2 6.4 19.2 19.2V492.8c0 12.8-6.4 19.2-19.2 19.2h-115.2c-12.8 0-19.2-6.4-19.2-19.2v-115.2c0-19.2 6.4-25.6 19.2-25.6zM160 288H320v-32H160z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="Component-biaotiwenzi" unicode="" d="M153.7024 691.2h537.6v-190.2336h-23.7824S622.1824 617.1136 568.6272 627.2512c-53.5296 10.1376-90.752 3.1744-90.752 3.1744l-0.6656-485.0432s14.848-32.768 39.3728-35.0976h54.2976V76.8H274.176l0.7424 34.304 47.5392 0.7936s35.712 11.7248 35.712 39.0144c0 27.264 0.768 475.5968 0.768 475.5968s-58.7264 8.5248-89.2416 0.7168C239.2064 619.4432 185.6512 572.672 177.4848 504.064L153.7024 503.2448V691.2zM614.5024 358.4h256v-87.1936h-11.3152s-21.6064 53.248-47.104 57.8816c-25.4976 4.6592-43.2128 1.4592-43.2128 1.4592l-0.3072-222.3104s7.0656-15.0272 18.7392-16.1024h25.856V76.8h-141.312l0.384 15.7184 22.6304 0.384s16.9984 5.376 16.9984 17.8688l0.3584 217.984s-27.9552 3.8912-42.496 0.3072c-14.4896-3.5584-40.0128-24.9856-43.904-56.4224l-11.3152-0.3584V358.4z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
<glyph glyph-name="zhuangxiu" unicode="" d="M445.952 499.965l12.917 13.032c9.51 9.512 21.912 15.082 34.84 16.848 1.716 39.99 3.69 80.217 5.726 120.965 1.627 32.558 17.067 163.853-8.732 188.85-43.355 42.007-44.254-24.555-43.097-65.867-5.763-88.952-3.755-181.703-1.654-273.828zM605.12 459.465l26.75-26.785c0.624 67.508 3.786 134.272 7.233 203.245 1.075 21.52 11.282 108.311-5.772 124.835-28.908 28.01-29.262-17.015-28.47-44.261-5.347-83.45-0.432-171.912 0.26-257.034zM780.289 115.47l-17.293 16.342 34.566 36.534c11.312 12.055 17.326 27.758 16.86 44.284-0.467 16.508-7.336 31.865-19.309 43.2l-248.15 234.83c-24.01 22.714-64.733 21.564-87.423-2.447l-81.082-86.555c-23.41-24.775-22.327-63.992 2.426-87.426l248.106-234.79c12.015-11.354 27.717-17.345 44.267-16.878 16.506 0.465 31.845 7.329 43.177 19.328l18.176 20.039 17.293-16.363c8.287-7.83 8.655-20.876 1.989-28.037l-60.275-54.584c-7.788-8.304-20.855-8.655-29.143-0.822L499.756 157.982c-24.79 23.412-64.015 22.367-87.424-2.405l-6.03-6.378 0.074-0.069L207.98-53.372c-4.349-4.565-4.227-17.783 3.995-25.617 8.222-7.833 21.43-7.314 25.78-2.749l198.478 202.59 0.059-0.056 6.007 6.359c7.812 8.305 20.876 8.65 29.14 0.799v0.023l2.122-2.002v-0.024l162.62-153.874c12.545-11.837 28.77-17.4 44.66-16.952 15.478 0.436 30.626 6.6 41.622 18.293l60.274 54.587c23.432 24.774 22.343 64.011-2.448 87.464z m-46.037 78.148v0.002c-3.91-4.031-9.046-6.156-14.258-6.303-5.362-0.152-10.758 1.76-14.892 5.766L491.36 399.245c-8.187 7.919-8.431 20.945-0.514 29.152 7.895 8.183 20.963 8.45 29.148 0.51l213.723-206.142c8.183-7.914 8.449-20.942 0.534-29.147zM724.563 455.178l4.485 20.074 6.784 5.45-6.89 5.652-5.605 13.611-3.96-14.177-6.98-5.924 6.793-4.956zM776.16 526.558l8.927 39.963 13.507 10.85-13.717 11.25-11.158 27.097-7.883-28.224-13.897-11.791 13.524-9.867zM239.592 235.259l6.304 28.222 9.538 7.662-9.687 7.945-7.879 19.135-5.566-19.93-9.814-8.328 9.55-6.968z" horiz-adv-x="1024" />
|
||||
|
||||
|
||||
|
||||
|
||||
</font>
|
||||
</defs></svg>
|
||||
|
After 
(image error) Size: 92 KiB |
BIN
src/assets/iconfont/iconfont.ttf
Normal file
BIN
src/assets/iconfont/iconfont.ttf
Normal file
Binary file not shown.
BIN
src/assets/iconfont/iconfont.woff
Normal file
BIN
src/assets/iconfont/iconfont.woff
Normal file
Binary file not shown.
BIN
src/assets/iconfont/iconfont.woff2
Normal file
BIN
src/assets/iconfont/iconfont.woff2
Normal file
Binary file not shown.
BIN
src/assets/images/Robot.png
Normal file
BIN
src/assets/images/Robot.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 24 KiB |
BIN
src/assets/images/add.png
Normal file
BIN
src/assets/images/add.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 1.4 KiB |
BIN
src/assets/images/backimg.png
Normal file
BIN
src/assets/images/backimg.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 1.6 KiB |
BIN
src/assets/images/card.png
Normal file
BIN
src/assets/images/card.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 3.2 KiB |
BIN
src/assets/images/fwb.png
Normal file
BIN
src/assets/images/fwb.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 33 KiB |
BIN
src/assets/images/headerimg.png
Normal file
BIN
src/assets/images/headerimg.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 21 KiB |
BIN
src/assets/images/il.jpg
Normal file
BIN
src/assets/images/il.jpg
Normal file
Binary file not shown.
|
After 
(image error) Size: 40 KiB |
BIN
src/assets/images/imgs.png
Normal file
BIN
src/assets/images/imgs.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 4.1 KiB |
BIN
src/assets/images/mor.png
Normal file
BIN
src/assets/images/mor.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 16 KiB |
BIN
src/assets/images/obliqueLine.png
Normal file
BIN
src/assets/images/obliqueLine.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 10 KiB |
BIN
src/assets/images/phoneTop.png
Normal file
BIN
src/assets/images/phoneTop.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 8.7 KiB |
BIN
src/assets/images/powder.png
Normal file
BIN
src/assets/images/powder.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 4.4 KiB |
42
src/components/componentscom/auxiliarysegmentation/index.vue
Normal file
42
src/components/componentscom/auxiliarysegmentation/index.vue
Normal file
@ -0,0 +1,42 @@
|
||||
<template>
|
||||
<div class="auxiliarysegmentation">
|
||||
<section
|
||||
class="contan"
|
||||
:style="{
|
||||
height: datas.blankHeight + 'px',
|
||||
padding: datas.paddType === 0 ? '0px' : '0px 15px',
|
||||
}"
|
||||
>
|
||||
<div
|
||||
v-show="datas.segmentationtype === 1"
|
||||
style="height: 1px; width: 100%; border-top-width: 1px"
|
||||
:style="{
|
||||
'border-top-style': datas.bordertp,
|
||||
'border-top-color': datas.auxliarColor,
|
||||
}"
|
||||
/>
|
||||
</section>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'auxiliarysegmentation',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.auxiliarysegmentation {
|
||||
position: relative;
|
||||
.contan {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
99
src/components/componentscom/captiontext/index.vue
Normal file
99
src/components/componentscom/captiontext/index.vue
Normal file
@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<div class="captiontext" :style="{ background: datas.backColor }">
|
||||
<div
|
||||
style="padding: 6px 0"
|
||||
:style="{
|
||||
'border-bottom': datas.borderBott
|
||||
? '1px solid #F9F9F9'
|
||||
: '1px solid #fff',
|
||||
}"
|
||||
>
|
||||
<!-- 标题 -->
|
||||
<h2
|
||||
:style="{
|
||||
'font-size': datas.wordSize + 'px',
|
||||
'font-weight': datas.wordWeight,
|
||||
color: datas.wordColor,
|
||||
'text-align': datas.positions,
|
||||
height: datas.wordHeight + 'px',
|
||||
'line-height': datas.wordHeight + 'px',
|
||||
'padding-right': !(datas.positions !== 'center' && datas.more.show)
|
||||
? '0'
|
||||
: '60px',
|
||||
}"
|
||||
v-if="datas.name"
|
||||
>
|
||||
{{ datas.name }}
|
||||
</h2>
|
||||
|
||||
<!-- 描述文字 -->
|
||||
<p
|
||||
:style="{
|
||||
'font-size': datas.descriptionSize + 'px',
|
||||
'font-weight': datas.descriptionWeight,
|
||||
color: datas.descriptionColor,
|
||||
'text-align': datas.positions,
|
||||
}"
|
||||
style="margin-top: 8px"
|
||||
v-if="datas.description"
|
||||
>
|
||||
{{ datas.description }}
|
||||
</p>
|
||||
|
||||
<!-- 更多 -->
|
||||
<p
|
||||
class="more"
|
||||
v-show="datas.more.show"
|
||||
:class="datas.positions !== 'center' ? 'lef' : ''"
|
||||
:style="{
|
||||
color: datas.more.type === 0 ? '#38f' : '',
|
||||
top: (datas.wordHeight - 6) / 2 + 'px',
|
||||
}"
|
||||
>
|
||||
{{ datas.more.type === 2 ? '' : datas.more.text }}
|
||||
<span> {{ datas.more.type === 0 ? '' : '>' }}</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'captiontext',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.captiontext {
|
||||
border: 2px solid #fff;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
padding: 0 14px;
|
||||
min-height: 20px;
|
||||
position: relative;
|
||||
|
||||
h2,
|
||||
p {
|
||||
word-wrap: break-word;
|
||||
min-height: 10px;
|
||||
}
|
||||
|
||||
/* 更多 */
|
||||
.more {
|
||||
font-size: 10px;
|
||||
color: #969799;
|
||||
text-align: center;
|
||||
&.lef {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
72
src/components/componentscom/commoditysearch/index.vue
Normal file
72
src/components/componentscom/commoditysearch/index.vue
Normal file
@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<div
|
||||
class="commoditysearch"
|
||||
:style="{
|
||||
background: datas.backgroundColor,
|
||||
border: `1px solid ${datas.backgroundColor}`,
|
||||
}"
|
||||
>
|
||||
<!-- 搜索框 -->
|
||||
<section
|
||||
class="searchs"
|
||||
:style="{
|
||||
height: datas.heights + 'px',
|
||||
'justify-content': datas.textPosition === 0 ? 'left' : 'center',
|
||||
background: datas.borderColor,
|
||||
'border-radius': datas.borderRadius === 0 ? '0px' : '10px',
|
||||
}"
|
||||
>
|
||||
<div class="search-left">
|
||||
<van-icon name="search" size="16" :style="{ color: datas.textColor }" />
|
||||
<span :style="{ color: datas.textColor }">搜索商品</span>
|
||||
</div>
|
||||
<!-- 扫一扫 -->
|
||||
<div
|
||||
class="sweep"
|
||||
v-show="datas.sweep"
|
||||
:style="{ color: datas.textColor }"
|
||||
>
|
||||
<span>扫一扫</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'commoditysearch',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.commoditysearch {
|
||||
position: relative;
|
||||
/* 搜索框 */
|
||||
.searchs {
|
||||
position: relative;
|
||||
width: 345px;
|
||||
min-height: 28px;
|
||||
margin: 5px auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
.search-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.sweep {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
i {
|
||||
margin: 0 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
95
src/components/componentscom/communitypowder/index.vue
Normal file
95
src/components/componentscom/communitypowder/index.vue
Normal file
@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<div class="communitypowder">
|
||||
<!-- 社区粉丝 -->
|
||||
<section class="powder" :style="{ background: datas.backColor }">
|
||||
<!-- 内容 -->
|
||||
<div class="container">
|
||||
<div class="lef">
|
||||
<img
|
||||
draggable="false"
|
||||
src="../../../assets/images/powder.png"
|
||||
alt=""
|
||||
v-if="!datas.mainImg"
|
||||
/>
|
||||
<img draggable="false" :src="datas.mainImg" alt="" v-else />
|
||||
<div class="text">
|
||||
<p class="first">{{ datas.title }}</p>
|
||||
<p class="last">{{ datas.describe }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<van-button class="rig" type="danger" size="small" color="#f44">{{
|
||||
datas.buttonName
|
||||
}}</van-button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'communitypowder',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.communitypowder {
|
||||
position: relative;
|
||||
/* 社区涨粉 */
|
||||
.powder {
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.container {
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 15px;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
/* 左半部分 */
|
||||
.lef {
|
||||
display: flex;
|
||||
img {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
margin-left: 10px;
|
||||
width: 146px;
|
||||
padding: 8px 0;
|
||||
.first {
|
||||
width: 100%;
|
||||
color: #333;
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.last {
|
||||
width: 100%;
|
||||
color: #a9a9a9;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
23
src/components/componentscom/crowdoperation/index.vue
Normal file
23
src/components/componentscom/crowdoperation/index.vue
Normal file
@ -0,0 +1,23 @@
|
||||
<template>
|
||||
<div class="crowdoperation">
|
||||
{{ datas.text }}
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'crowdoperation',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.crowdoperation {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
26
src/components/componentscom/custommodule/index.vue
Normal file
26
src/components/componentscom/custommodule/index.vue
Normal file
@ -0,0 +1,26 @@
|
||||
<template>
|
||||
<div class="custommodule">
|
||||
{{ datas.demo }}
|
||||
<img :src="datas.img" alt="">
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'custommodule',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.custommodule {
|
||||
position: relative;
|
||||
img{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
29
src/components/componentscom/entertheshop/index.vue
Normal file
29
src/components/componentscom/entertheshop/index.vue
Normal file
@ -0,0 +1,29 @@
|
||||
<template>
|
||||
<div class="entertheshop">
|
||||
<!-- 内容 -->
|
||||
<van-cell
|
||||
icon="shop-collect-o"
|
||||
:title="datas.shopName"
|
||||
is-link
|
||||
:value="datas.copywriting"
|
||||
/>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'entertheshop',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.entertheshop {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
62
src/components/componentscom/follow/index.vue
Normal file
62
src/components/componentscom/follow/index.vue
Normal file
@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<div id="follow">
|
||||
<div class="follow-box">
|
||||
<div class="follow-pic">
|
||||
<img :src="datas.heade" alt="" />
|
||||
</div>
|
||||
<div class="follow-info">
|
||||
<span>{{ datas.followName }}</span>
|
||||
</div>
|
||||
<div class="follow-right">
|
||||
<van-button color="#07C160">关注公众号</van-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'follow',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
#follow {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
box-sizing: border-box;
|
||||
.follow-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border: 1px solid #999;
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
.follow-pic {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.follow-info {
|
||||
flex: 1;
|
||||
margin-left: 20px;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
142
src/components/componentscom/graphicnavigation/index.vue
Normal file
142
src/components/componentscom/graphicnavigation/index.vue
Normal file
@ -0,0 +1,142 @@
|
||||
<template>
|
||||
<div
|
||||
class="graphicnavigation"
|
||||
:style="{ backgroundImage: 'url(' + datas.bgImg + ')' }"
|
||||
>
|
||||
<!-- 默认导航 -->
|
||||
<section
|
||||
class="defaultNavigation"
|
||||
v-if="!datas.imageList[0]"
|
||||
:style="{
|
||||
background: datas.backgroundColor,
|
||||
display: datas.imgStyle === 0 ? 'flex' : '-webkit-box',
|
||||
'overflow-x': datas.imgStyle === 0 ? '' : 'scroll',
|
||||
}"
|
||||
>
|
||||
<!-- 导航 -->
|
||||
<div
|
||||
class="navigationList"
|
||||
v-for="index in 5"
|
||||
:key="index"
|
||||
:style="{
|
||||
width:
|
||||
datas.imgStyle === 0 ? 'auto' : 375 / datas.showSize - 1 + 'px',
|
||||
}"
|
||||
>
|
||||
<!-- 图片 -->
|
||||
<img
|
||||
src="../../../assets/images/imgs.png"
|
||||
alt="默认图片"
|
||||
v-show="datas.navigationType === 0"
|
||||
draggable="false"
|
||||
:style="{ 'border-radius': datas.borderRadius + '%' }"
|
||||
/>
|
||||
<!-- 文字 -->
|
||||
<p :style="{ color: datas.textColor }">导航</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 导航列表 -->
|
||||
<section
|
||||
class="defaultNavigation"
|
||||
v-else
|
||||
:style="{
|
||||
background: datas.backgroundColor,
|
||||
display: datas.imgStyle === 0 ? 'flex' : '-webkit-box',
|
||||
'flex-wrap': datas.imgStyle === 0 ? 'wrap' : 'nowrap',
|
||||
'justify-content':
|
||||
datas.imgStyle === 0 ? 'space-evenly' : 'space-around',
|
||||
'overflow-x': datas.imgStyle === 0 ? '' : 'scroll',
|
||||
}"
|
||||
>
|
||||
<!-- 导航 -->
|
||||
<div
|
||||
class="navigationList"
|
||||
v-for="(item, index) in datas.imageList"
|
||||
:key="index"
|
||||
:style="{
|
||||
width: datas.imgStyle === 0 ? '20%' : 375 / datas.showSize - 1 + 'px',
|
||||
}"
|
||||
>
|
||||
<!-- 图片 -->
|
||||
<img
|
||||
:src="item.src"
|
||||
alt="默认图片"
|
||||
v-show="datas.navigationType === 0"
|
||||
draggable="false"
|
||||
:style="{ 'border-radius': datas.borderRadius + '%' }"
|
||||
/>
|
||||
<!-- 文字 -->
|
||||
<p
|
||||
:style="{
|
||||
color: datas.textColor,
|
||||
'font-size': datas.textSize + 'px',
|
||||
height: datas.textHeight + 'px',
|
||||
'line-height': datas.textHeight + 'px',
|
||||
}"
|
||||
>
|
||||
{{ item.text }}
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'graphicnavigation',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
created(){
|
||||
console.log(this.datas,'--------graphicnavigation')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.graphicnavigation {
|
||||
position: relative;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
/* 默认导航 */
|
||||
.defaultNavigation {
|
||||
// overflow-x: scroll;
|
||||
justify-content: space-evenly;
|
||||
&::-webkit-scrollbar {
|
||||
height: 1px;
|
||||
}
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: #155bd4;
|
||||
}
|
||||
/deep/.el-collapse-item__header,
|
||||
/deep/.el-collapse-item__wrap {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
/* 导航 */
|
||||
.navigationList {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
img {
|
||||
margin-top: 5px;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
}
|
||||
p {
|
||||
font-size: 12px;
|
||||
margin-top: 5px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
24
src/components/componentscom/index.js
Normal file
24
src/components/componentscom/index.js
Normal file
@ -0,0 +1,24 @@
|
||||
export { default as captiontext } from './captiontext'
|
||||
export { default as pictureads } from './pictureads'
|
||||
export { default as placementarea } from './placementarea'
|
||||
export { default as graphicnavigation } from './graphicnavigation'
|
||||
export { default as richtext } from './richtext'
|
||||
export { default as magiccube } from './magiccube'
|
||||
export { default as auxiliarysegmentation } from './auxiliarysegmentation'
|
||||
export { default as commoditysearch } from './commoditysearch'
|
||||
export { default as storeinformation } from './storeinformation'
|
||||
export { default as entertheshop } from './entertheshop'
|
||||
export { default as notice } from './notice'
|
||||
export { default as videoss } from './videoss'
|
||||
export { default as voicer } from './voicer'
|
||||
export { default as custommodule } from './custommodule'
|
||||
export { default as communitypowder } from './communitypowder'
|
||||
export { default as storenotecard } from './storenotecard'
|
||||
export { default as crowdoperation } from './crowdoperation'
|
||||
export { default as personalizedrecommendation } from './personalizedrecommendation'
|
||||
export { default as onlineservice } from './onlineservice'
|
||||
export { default as listswitching } from './listswitching'
|
||||
export { default as investigate } from './investigate'
|
||||
export { default as tabBar } from './tabBar'
|
||||
export { default as follow } from './follow'
|
||||
export { default as suspension } from './suspension'
|
||||
272
src/components/componentscom/investigate/index.vue
Normal file
272
src/components/componentscom/investigate/index.vue
Normal file
@ -0,0 +1,272 @@
|
||||
<template>
|
||||
<div class="investigate" @click="guanbi">
|
||||
<!-- 内容 -->
|
||||
<div class="title">{{ datas.title }}</div>
|
||||
<div
|
||||
class="rescon"
|
||||
v-for="(item1, index1) in datas.jsonData"
|
||||
:key="index1"
|
||||
@mouseleave="leave()"
|
||||
>
|
||||
<!-- 输入框 -->
|
||||
<div v-if="item1.type == 0">
|
||||
<van-cell-group>
|
||||
<van-field
|
||||
:label="item1.name"
|
||||
:placeholder="item1.value"
|
||||
:value="item1.value2"
|
||||
readonly="readonly"
|
||||
/>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
|
||||
<!-- 下拉框 -->
|
||||
<div v-if="item1.type == 1" class="xiala">
|
||||
<div class="titlename">{{ item1.name }}</div>
|
||||
<div class="select">
|
||||
<input
|
||||
type="text"
|
||||
readonly="readonly"
|
||||
:placeholder="'点击选择' + item1.name"
|
||||
class="readinput"
|
||||
@click="showpic(index1)"
|
||||
:value="item1.value2"
|
||||
/>
|
||||
<ul :class="{ ulshow: item1.showPicker, ultext: true }">
|
||||
<li
|
||||
v-for="(item, index) in item1.value1"
|
||||
:key="index"
|
||||
@click="xuanze(index1, item)"
|
||||
>
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 单选框 -->
|
||||
<van-field name="radio" :label="item1.name" v-if="item1.type == 2">
|
||||
<template #input>
|
||||
<van-radio-group :value="item1.value2" direction="horizontal">
|
||||
<van-radio
|
||||
:name="item"
|
||||
v-for="(item, index) in item1.value1"
|
||||
:key="index"
|
||||
>{{ item }}</van-radio
|
||||
>
|
||||
</van-radio-group>
|
||||
</template>
|
||||
</van-field>
|
||||
|
||||
<!-- 复选框 -->
|
||||
|
||||
<van-field
|
||||
name="checkboxGroup"
|
||||
:label="item1.name"
|
||||
v-if="item1.type == 3"
|
||||
>
|
||||
<template #input>
|
||||
<van-checkbox-group direction="horizontal">
|
||||
<van-checkbox
|
||||
:name="item"
|
||||
v-for="(item, index) in item1.value1"
|
||||
:key="index"
|
||||
:shape="item1.name"
|
||||
>{{ item }}</van-checkbox
|
||||
>
|
||||
</van-checkbox-group>
|
||||
</template>
|
||||
</van-field>
|
||||
</div>
|
||||
<div class="button">
|
||||
<button>提交</button>
|
||||
</div>
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'investigate',
|
||||
data() {
|
||||
return {
|
||||
jsonData: [],
|
||||
}
|
||||
},
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
//点击显示下拉框
|
||||
showpic(index1) {
|
||||
event.stopPropagation()
|
||||
this.datas.jsonData.forEach((el) => {
|
||||
el.showPicker = false
|
||||
})
|
||||
this.datas.jsonData[index1].showPicker = !this.datas.jsonData[index1]
|
||||
.showPicker
|
||||
},
|
||||
|
||||
// //下拉选择
|
||||
xuanze(index1) {
|
||||
this.datas.jsonData[index1].showPicker = false
|
||||
},
|
||||
|
||||
//关闭下拉选项
|
||||
guanbi() {
|
||||
this.datas.jsonData.forEach((el) => {
|
||||
el.showPicker = false
|
||||
})
|
||||
},
|
||||
leave() {
|
||||
this.datas.jsonData.forEach((el) => {
|
||||
el.showPicker = false
|
||||
})
|
||||
},
|
||||
//
|
||||
},
|
||||
watch: {},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.investigate {
|
||||
position: relative;
|
||||
padding: 0 6px;
|
||||
}
|
||||
form select {
|
||||
appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
.xiala {
|
||||
position: relative;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
padding: 10px 16px;
|
||||
// overflow: hidden;
|
||||
color: #323233;
|
||||
font-size: 14px;
|
||||
line-height: 24px;
|
||||
background-color: #fff;
|
||||
.titlename {
|
||||
width: 5.6em;
|
||||
margin-right: 12px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
select {
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
.title {
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
/deep/.van-cell {
|
||||
display: block;
|
||||
}
|
||||
/deep/.el-form-item__label {
|
||||
text-align: center;
|
||||
width: 100% !important;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
/deep/.el-form-item__content {
|
||||
margin-left: 100% !important;
|
||||
}
|
||||
/* 上传图片按钮 */
|
||||
.uploadImg {
|
||||
width: 200px;
|
||||
height: 40px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
/deep/.van-radio,
|
||||
.van-checkbox {
|
||||
padding: 4px 0px;
|
||||
}
|
||||
/deep/.van-field__label {
|
||||
width: 100%;
|
||||
// overflow: hidden;
|
||||
// white-space: nowrap;
|
||||
// text-overflow: ellipsis;
|
||||
padding-left: 10px;
|
||||
border-bottom: 1px solid #dddddd;
|
||||
padding-bottom: 10px;
|
||||
line-height: 20px;
|
||||
font-size: 13px;
|
||||
}
|
||||
/deep/.van-field__value {
|
||||
padding-left: 10px;
|
||||
font-size: 13px;
|
||||
padding-top: 5px;
|
||||
}
|
||||
.button {
|
||||
padding: 12px 24px;
|
||||
button {
|
||||
width: 100%;
|
||||
background: rgb(48, 116, 243);
|
||||
color: #fff;
|
||||
padding: 8px;
|
||||
border-radius: 20px;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
.select {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
.readinput {
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: #323233;
|
||||
line-height: inherit;
|
||||
text-align: left;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
resize: none;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
.ultext {
|
||||
display: none;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
transition: all linear 1s;
|
||||
background: #fff;
|
||||
z-index: 100;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 0 16px 1px rgba(200, 200, 200, 0.5);
|
||||
li {
|
||||
padding: 4px 16px;
|
||||
border-bottom: 1px solid #eeeeee;
|
||||
&:hover {
|
||||
background: #c3d4f5;
|
||||
}
|
||||
}
|
||||
}
|
||||
.ulshow {
|
||||
display: block;
|
||||
height: auto;
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
margin-top: 6px;
|
||||
position: absolute;
|
||||
}
|
||||
</style>
|
||||
1485
src/components/componentscom/listswitching/index.vue
Normal file
1485
src/components/componentscom/listswitching/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
445
src/components/componentscom/magiccube/index.vue
Normal file
445
src/components/componentscom/magiccube/index.vue
Normal file
@ -0,0 +1,445 @@
|
||||
<template>
|
||||
<div
|
||||
class="magiccube"
|
||||
:style="{
|
||||
'padding-left': datas.pageMargin + 'px',
|
||||
'padding-right': datas.pageMargin + 'px',
|
||||
}"
|
||||
>
|
||||
<img
|
||||
draggable="false"
|
||||
v-show="!showimageList"
|
||||
src="../../../assets/images/mor.png"
|
||||
alt=""
|
||||
style="width: 100%"
|
||||
/>
|
||||
|
||||
<!-- 一行二个 -->
|
||||
<section
|
||||
class="buju buju0"
|
||||
v-show="datas.rubiksCubeType === 0 && showimageList"
|
||||
>
|
||||
<div
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
class="rubiksCubeType0 rubiksCubeType"
|
||||
>
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.imageList[index - 1].src"
|
||||
alt=""
|
||||
:style="{ padding: datas.imgMargin / 2 + 'px' }"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一行三个 -->
|
||||
<section
|
||||
class="buju buju0"
|
||||
v-show="datas.rubiksCubeType === 1 && showimageList"
|
||||
>
|
||||
<div
|
||||
v-for="index in 3"
|
||||
:key="index"
|
||||
class="rubiksCubeType1 rubiksCubeType"
|
||||
:style="{
|
||||
margin: datas.imgMargin / 10 + '%',
|
||||
width: 33.33 + '%',
|
||||
}"
|
||||
>
|
||||
<!-- width: 33 - datas.imgMargin / 10 + '%', -->
|
||||
<img draggable="false" :src="datas.imageList[index - 1].src" alt="" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一行四个 -->
|
||||
<section
|
||||
class="buju buju0"
|
||||
v-show="datas.rubiksCubeType === 2 && showimageList"
|
||||
>
|
||||
<div
|
||||
v-for="index in 4"
|
||||
:key="index"
|
||||
class="rubiksCubeType2 rubiksCubeType"
|
||||
:style="{
|
||||
margin: datas.imgMargin / 10 + '%',
|
||||
width: 25 - datas.imgMargin / 10 + '%',
|
||||
}"
|
||||
>
|
||||
<img draggable="false" :src="datas.imageList[index - 1].src" alt="" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 二左二右 -->
|
||||
<section
|
||||
class="buju buju0"
|
||||
v-show="datas.rubiksCubeType === 3 && showimageList"
|
||||
>
|
||||
<div
|
||||
v-for="index in 4"
|
||||
:key="index"
|
||||
class="rubiksCubeType3 rubiksCubeType"
|
||||
>
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.imageList[index - 1].src"
|
||||
alt=""
|
||||
:style="{ padding: datas.imgMargin + 'px' }"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一左二右 -->
|
||||
<section
|
||||
class="buju buju4"
|
||||
v-show="datas.rubiksCubeType === 4 && showimageList"
|
||||
>
|
||||
<div class="rubiksCubeType hw" style="padding-top: 100%">
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.imageList[0].src"
|
||||
alt=""
|
||||
style="height:300px"
|
||||
:style="{ 'padding-right': datas.imgMargin + 'px' }"
|
||||
/>
|
||||
</div>
|
||||
<div style="display: inline-flex; flex-direction: column; width: 100%">
|
||||
<div
|
||||
class=" hw imgone"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
style="padding-top: 150px;height:150px"
|
||||
>
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.imageList[index].src"
|
||||
alt=""
|
||||
style="height:150px"
|
||||
:style="{ padding: datas.imgMargin + 'px'}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一上二下 -->
|
||||
<section
|
||||
class="buju buju5"
|
||||
v-show="datas.rubiksCubeType === 5 && showimageList"
|
||||
>
|
||||
<div class="rubiksCubeType hw" style="display: block; padding-top: 50%">
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.imageList[0].src"
|
||||
alt=""
|
||||
:style="{ 'padding-bottom': datas.imgMargin + 'px' }"
|
||||
/>
|
||||
</div>
|
||||
<div style="display: flex; width: 100%">
|
||||
<div
|
||||
class="rubiksCubeType hw imgtow"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
style="padding-top: 50%"
|
||||
>
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.imageList[index].src"
|
||||
alt=""
|
||||
:style="{ padding: datas.imgMargin + 'px' }"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一左三右 -->
|
||||
<section
|
||||
class="buju buju4"
|
||||
v-show="datas.rubiksCubeType === 6 && showimageList"
|
||||
>
|
||||
<!-- 第一张图片 -->
|
||||
<div class="rubiksCubeType hw" style="padding-top: 100%">
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.imageList[0].src"
|
||||
alt=""
|
||||
style="height:300px"
|
||||
:style="{ 'padding-right': datas.imgMargin + 'px' }"
|
||||
/>
|
||||
</div>
|
||||
<div style="display: inline-flex; flex-direction: column; width: 100%">
|
||||
<!-- 第二张图片 -->
|
||||
<div class="rubiksCubeType hw" style="padding-top: 150px">
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.imageList[1].src"
|
||||
alt=""
|
||||
:style="{
|
||||
'padding-bottom': datas.imgMargin + 'px',
|
||||
'padding-left': datas.imgMargin + 'px',
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
<div class="rubiksCubeType">
|
||||
<div
|
||||
class="hw"
|
||||
style="
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-top: 150px;
|
||||
"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.imageList[index + 1].src"
|
||||
alt=""
|
||||
style="height:150px"
|
||||
:style="{
|
||||
'padding-left': datas.imgMargin + 'px',
|
||||
'padding-top': datas.imgMargin + 'px',
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'magiccube',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
computed: {
|
||||
showimageList() {
|
||||
if (
|
||||
this.datas.rubiksCubeType === 0 &&
|
||||
!this.datas.imageList[0].src &&
|
||||
!this.datas.imageList[1].src
|
||||
)
|
||||
return false
|
||||
|
||||
if (
|
||||
(this.datas.rubiksCubeType === 1 ||
|
||||
this.datas.rubiksCubeType === 4 ||
|
||||
this.datas.rubiksCubeType === 5) &&
|
||||
!this.datas.imageList[0].src &&
|
||||
!this.datas.imageList[1].src &&
|
||||
!this.datas.imageList[2].src
|
||||
)
|
||||
return false
|
||||
|
||||
if (
|
||||
(this.datas.rubiksCubeType === 2 ||
|
||||
this.datas.rubiksCubeType === 6 ||
|
||||
this.datas.rubiksCubeType === 3) &&
|
||||
!this.datas.imageList[0].src &&
|
||||
!this.datas.imageList[1].src &&
|
||||
!this.datas.imageList[2].src &&
|
||||
!this.datas.imageList[3].src
|
||||
)
|
||||
return false
|
||||
|
||||
return true
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.magiccube {
|
||||
position: relative;
|
||||
/* 布局 */
|
||||
.imgone {
|
||||
&:last-of-type {
|
||||
img {
|
||||
padding-bottom: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
}
|
||||
&:first-of-type {
|
||||
img {
|
||||
padding-top: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.imgtow {
|
||||
&:first-of-type {
|
||||
img {
|
||||
padding-bottom: 0 !important;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
}
|
||||
&:last-of-type {
|
||||
img {
|
||||
padding-bottom: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.hw {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.buju {
|
||||
&.buju0 {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
&.buju4 {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.active {
|
||||
background: #e0edff;
|
||||
border: 1px solid #155bd4;
|
||||
color: #155bd4;
|
||||
z-index: 2;
|
||||
}
|
||||
.rubiksCubeType {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
&.rubiksCubeType0 {
|
||||
width: 50%;
|
||||
// height: 200px;
|
||||
&:first-of-type {
|
||||
img {
|
||||
padding-left: 0 !important;
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
&:last-of-type {
|
||||
img {
|
||||
padding-right: 0 !important;
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
img {
|
||||
width: 100%;
|
||||
// height: 200px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&.rubiksCubeType1 {
|
||||
width: 33.333%;
|
||||
&:nth-of-type(1) {
|
||||
margin-left: 0 !important;
|
||||
margin-top: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
&:nth-of-type(2) {
|
||||
margin-top: 0 !important;
|
||||
margin-left: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
&:nth-of-type(3) {
|
||||
margin-top: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
img {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&.rubiksCubeType2 {
|
||||
width: 25%;
|
||||
&:nth-of-type(1) {
|
||||
margin-left: 0 !important;
|
||||
margin-top: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
&:nth-of-type(2) {
|
||||
margin-top: 0 !important;
|
||||
margin-left: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
&:nth-of-type(3) {
|
||||
margin-top: 0 !important;
|
||||
margin-left: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
&:nth-of-type(4) {
|
||||
margin-top: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
img {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&.rubiksCubeType3 {
|
||||
width: 50%;
|
||||
padding-top: 50%;
|
||||
position: relative;
|
||||
&:nth-of-type(1) {
|
||||
img {
|
||||
padding-top: 0 !important;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
}
|
||||
&:nth-of-type(2) {
|
||||
img {
|
||||
padding-top: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
}
|
||||
&:nth-of-type(3) {
|
||||
img {
|
||||
padding-bottom: 0 !important;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
}
|
||||
&:nth-of-type(4) {
|
||||
img {
|
||||
padding-bottom: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
}
|
||||
img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
&.rubiksCubeType4 {
|
||||
width: 187px;
|
||||
height: 187px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
29
src/components/componentscom/notice/index.vue
Normal file
29
src/components/componentscom/notice/index.vue
Normal file
@ -0,0 +1,29 @@
|
||||
<template>
|
||||
<div class="notice">
|
||||
<!-- 公告 -->
|
||||
<van-notice-bar
|
||||
:text="datas.noticeText"
|
||||
left-icon="volume-o"
|
||||
:background="datas.backColor"
|
||||
:color="datas.textColor"
|
||||
/>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'notice',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.notice {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
23
src/components/componentscom/onlineservice/index.vue
Normal file
23
src/components/componentscom/onlineservice/index.vue
Normal file
@ -0,0 +1,23 @@
|
||||
<template>
|
||||
<div class="onlineservice">
|
||||
{{ datas.text }}
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'onlineservice',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.onlineservice {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,23 @@
|
||||
<template>
|
||||
<div class="personalizedrecommendation">
|
||||
{{ datas.text }}
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'personalizedrecommendation',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.personalizedrecommendation {
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
320
src/components/componentscom/pictureads/index.vue
Normal file
320
src/components/componentscom/pictureads/index.vue
Normal file
@ -0,0 +1,320 @@
|
||||
<template>
|
||||
<div class="pictureads">
|
||||
<!-- 无图片 -->
|
||||
<div class="upload" v-if="!imageList[0]">
|
||||
<i class="iconfont icon-lunbotu"></i>
|
||||
</div>
|
||||
|
||||
<!-- 一行一个 -->
|
||||
<div
|
||||
v-if="imageList[0] && swiperType === 0"
|
||||
class="type0"
|
||||
:style="{
|
||||
'padding-left': datas.pageMargin + 'px',
|
||||
'padding-right': datas.pageMargin + 'px',
|
||||
}"
|
||||
>
|
||||
<div
|
||||
v-for="(item, index) in imageList"
|
||||
:key="index"
|
||||
class="imgLis"
|
||||
:style="{ 'margin-bottom': datas.imageMargin + 'px' }"
|
||||
>
|
||||
<!-- 图片 -->
|
||||
<img
|
||||
:src="item.src"
|
||||
draggable="false"
|
||||
:style="{ 'border-radius': datas.borderRadius + 'px' }"
|
||||
/>
|
||||
<!-- 图片标题 -->
|
||||
<p class="title" v-show="item.text ? true : false">{{ item.text }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 轮播组件 -->
|
||||
<div
|
||||
class="swiper-container"
|
||||
v-if="
|
||||
(imageList[0] && swiperType === 1) ||
|
||||
swiperType === 2 ||
|
||||
swiperType === 3
|
||||
"
|
||||
>
|
||||
<div
|
||||
:class="
|
||||
swiperType === 3 && imageList[0]
|
||||
? 'type3 type1 swiper-wrapper type3H'
|
||||
: 'swiper-wrapper type1'
|
||||
"
|
||||
>
|
||||
<div
|
||||
class="swiper-slide"
|
||||
v-for="(item, index) in imageList"
|
||||
:key="index"
|
||||
>
|
||||
<!-- 图片 -->
|
||||
<img
|
||||
:src="item.src"
|
||||
alt=""
|
||||
draggable="false"
|
||||
:style="{ 'border-radius': datas.borderRadius + 'px' }"
|
||||
/>
|
||||
<!-- 图片标题 -->
|
||||
<p class="title" v-show="item.text ? true : false">{{ item.text }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 分页器 -->
|
||||
<div class="swiper-pagination" style="color: #007aff"></div>
|
||||
</div>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Swiper from 'swiper'
|
||||
import 'swiper/css/swiper.min.css'
|
||||
|
||||
export default {
|
||||
name: 'pictureads',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
mySwiper: null,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
/* 类型切换 */
|
||||
swiperType() {
|
||||
console.log(this.datas.swiperType, '----------------轮播类型')
|
||||
this.addSwiper()
|
||||
return this.datas.swiperType
|
||||
},
|
||||
/* 图片删除或者增加 */
|
||||
imageList() {
|
||||
this.addSwiper()
|
||||
console.log(this.datas.imageList.length, '-------轮播数量')
|
||||
return this.datas.imageList
|
||||
},
|
||||
/* 分页器类型切换 */
|
||||
pagingType() {
|
||||
this.addSwiper()
|
||||
return this.datas.pagingType
|
||||
},
|
||||
/* 一行个数 */
|
||||
rowindividual() {
|
||||
this.addSwiper()
|
||||
if (this.datas.swiperType === 1) {
|
||||
return 1
|
||||
} else {
|
||||
return this.datas.rowindividual
|
||||
}
|
||||
},
|
||||
/* 图片间距 */
|
||||
imageMargin() {
|
||||
this.addSwiper()
|
||||
if (this.datas.swiperType === 1) {
|
||||
return 0
|
||||
} else {
|
||||
return this.datas.imageMargin
|
||||
}
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
pagingType() {},
|
||||
rowindividual() {},
|
||||
imageMargin() {},
|
||||
},
|
||||
methods: {
|
||||
/* 创建轮播对象 */
|
||||
addSwiper() {
|
||||
this.$nextTick(() => {
|
||||
if (this.datas.swiperType !== 0 && this.datas.imageList[0]) {
|
||||
if (this.mySwiper instanceof Array) {
|
||||
this.mySwiper.forEach((element) => {
|
||||
element.destroy()
|
||||
})
|
||||
} else if (this.mySwiper instanceof Object) {
|
||||
// 每次重新创建swiper前都要销毁之前存在的轮播 不然轮播会重复
|
||||
this.mySwiper.destroy()
|
||||
}
|
||||
|
||||
let params = {
|
||||
loop: true,
|
||||
autoplay: true,
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
type: this.pagingType,
|
||||
},
|
||||
}
|
||||
|
||||
if (this.datas.swiperType === 1 || this.datas.swiperType === 2) {
|
||||
params.slidesPerView = this.rowindividual
|
||||
params.spaceBetween = this.imageMargin
|
||||
} else if (this.datas.swiperType === 3) {
|
||||
params.slidesPerView = 1.3
|
||||
params.centeredSlides = true
|
||||
}
|
||||
|
||||
this.mySwiper = new Swiper('.swiper-container', params)
|
||||
} else {
|
||||
if (this.mySwiper instanceof Array) {
|
||||
this.mySwiper.forEach((element) => {
|
||||
element.destroy()
|
||||
})
|
||||
}
|
||||
// 每次重新创建swiper前都要销毁之前存在的轮播 不然轮播会重复
|
||||
if (this.mySwiper instanceof Object) {
|
||||
this.mySwiper.destroy()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.pictureads {
|
||||
position: relative;
|
||||
|
||||
/* 无图片 */
|
||||
.upload {
|
||||
background: #979797;
|
||||
width: 100%;
|
||||
height: 250px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
i {
|
||||
font-size: 120px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 类型0 */
|
||||
.type0 {
|
||||
box-sizing: border-box;
|
||||
/* 图片列表 */
|
||||
.imgLis {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
&:last-child {
|
||||
margin: 0 !important;
|
||||
}
|
||||
/* 图片 */
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
.title {
|
||||
height: 36px;
|
||||
width: 100%;
|
||||
background-color: rgba(51, 51, 51, 0.8);
|
||||
text-align: center;
|
||||
line-height: 36px;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 类型1 */
|
||||
.type1 {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
.swiper-slide {
|
||||
width: 100%;
|
||||
height: 250px;
|
||||
}
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
.title {
|
||||
height: 36px;
|
||||
width: 100%;
|
||||
background-color: rgba(51, 51, 51, 0.8);
|
||||
text-align: center;
|
||||
line-height: 36px;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
text-align: left;
|
||||
box-sizing: border-box;
|
||||
padding: 0 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.type3 {
|
||||
width: 100%;
|
||||
height: 250px;
|
||||
align-items: center;
|
||||
.swiper-slide {
|
||||
height: 210px !important;
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
background: #fff;
|
||||
box-shadow: rgba(173, 173, 173, 0.8) 0px 7px 24px 0px;
|
||||
border-radius: 12px;
|
||||
overflow: hidden;
|
||||
|
||||
/* Center slide text vertically */
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
transition: 300ms;
|
||||
transform: scale(0.8);
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.swiper-slide-active,
|
||||
.swiper-slide-duplicate-active {
|
||||
transform: scale(1);
|
||||
}
|
||||
.swiper-pagination {
|
||||
bottom: 0 !important;
|
||||
}
|
||||
.title {
|
||||
height: 36px;
|
||||
width: 100%;
|
||||
background-color: rgba(51, 51, 51, 0.8);
|
||||
text-align: center;
|
||||
line-height: 36px;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
text-align: left;
|
||||
box-sizing: border-box;
|
||||
padding: 0 5px;
|
||||
}
|
||||
}
|
||||
.type3H {
|
||||
height: 250px;
|
||||
}
|
||||
.swiper-container-horizontal > .swiper-pagination-progressbar {
|
||||
height: 2px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
35
src/components/componentscom/placementarea/index.vue
Normal file
35
src/components/componentscom/placementarea/index.vue
Normal file
@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<div class="placementarea">
|
||||
<span>组件放置区域</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'placementarea',
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.placementarea {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background: #94b4eb;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-image: url('../../../assets/images/obliqueLine.png');
|
||||
background-size: 50%, 100%;
|
||||
transition: all 0.5s;
|
||||
span {
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
width: 140px;
|
||||
height: 25px;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
line-height: 25px;
|
||||
background: #5487df;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
42
src/components/componentscom/richtext/index.vue
Normal file
42
src/components/componentscom/richtext/index.vue
Normal file
@ -0,0 +1,42 @@
|
||||
<template>
|
||||
<div class="richtext" :style="{ background: datas.backColor }">
|
||||
<img
|
||||
draggable="false"
|
||||
src="../../../assets/images/fwb.png"
|
||||
alt=""
|
||||
v-if="!datas.myValue.length"
|
||||
/>
|
||||
<section v-else v-html="datas.myValue" />
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'richtext',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.richtext {
|
||||
position: relative;
|
||||
}
|
||||
/deep/img {
|
||||
max-width: 100% !important;
|
||||
display: block;
|
||||
}
|
||||
.richtext {
|
||||
position: relative;
|
||||
/deep/pre {
|
||||
white-space: break-spaces;
|
||||
}
|
||||
/deep/p {
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
428
src/components/componentscom/storeinformation/index.vue
Normal file
428
src/components/componentscom/storeinformation/index.vue
Normal file
@ -0,0 +1,428 @@
|
||||
<template>
|
||||
<div class="storeinformation">
|
||||
<!-- 样式一 -->
|
||||
<section
|
||||
class="type0"
|
||||
v-show="datas.rubiksCubeType === 0 || datas.rubiksCubeType === 2"
|
||||
>
|
||||
<div
|
||||
v-if="datas.rubiksCubeType === 0"
|
||||
class="menban"
|
||||
style="background-color: rgba(0, 0, 0, 0.3)"
|
||||
/>
|
||||
<div
|
||||
v-else
|
||||
class="menban"
|
||||
style="background-image: linear-gradient(to top, #000, transparent)"
|
||||
/>
|
||||
|
||||
<!-- 蒙版 -->
|
||||
<div class="men">
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="datas.bakcgroundImg"
|
||||
:src="datas.bakcgroundImg"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
src="../../../assets/images/backimg.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 店铺信息 -->
|
||||
<div class="storIinformation">
|
||||
<div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="datas.headPortrait"
|
||||
:src="datas.headPortrait"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
src="../../../assets/images/headerimg.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p style="margin-top: 5px; font-weight: 700; font-size: 18px">
|
||||
{{ datas.name }}
|
||||
</p>
|
||||
<p style="font-size: 12px; margin-top: 10px">{{ datas.Discount }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 样式二 -->
|
||||
<section class="type1" v-show="datas.rubiksCubeType === 1">
|
||||
<div
|
||||
class="menban"
|
||||
style="background-image: linear-gradient(to top, #000, transparent)"
|
||||
/>
|
||||
<!-- 蒙版 -->
|
||||
<div class="men">
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="datas.bakcgroundImg"
|
||||
:src="datas.bakcgroundImg"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
src="../../../assets/images/backimg.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 店铺信息 -->
|
||||
<div class="storIinformation">
|
||||
<div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="datas.headPortrait"
|
||||
:src="datas.headPortrait"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
src="../../../assets/images/headerimg.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p style="margin-top: 5px; font-weight: 700; font-size: 18px">
|
||||
{{ datas.name }}
|
||||
</p>
|
||||
<p style="font-size: 12px; margin-top: 10px">{{ datas.Discount }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 样式四 -->
|
||||
<section class="type3" v-show="datas.rubiksCubeType === 3">
|
||||
<div
|
||||
class="menban"
|
||||
style="background-image: linear-gradient(to top, #000, transparent)"
|
||||
/>
|
||||
<!-- 蒙版 -->
|
||||
<div class="men">
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="datas.bakcgroundImg"
|
||||
:src="datas.bakcgroundImg"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
src="../../../assets/images/backimg.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 店铺信息 -->
|
||||
<div class="storIinformation">
|
||||
<div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="datas.headPortrait"
|
||||
:src="datas.headPortrait"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
src="../../../assets/images/headerimg.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p style="margin-top: 5px; font-weight: 700; font-size: 18px">
|
||||
{{ datas.name }}
|
||||
</p>
|
||||
<p style="font-size: 12px; margin-top: 10px">{{ datas.Discount }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 样式五 -->
|
||||
<section class="type4" v-show="datas.rubiksCubeType === 4">
|
||||
<div
|
||||
class="menban"
|
||||
style="background-image: linear-gradient(to top, #000, transparent)"
|
||||
/>
|
||||
<!-- 蒙版 -->
|
||||
<div class="men">
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="datas.bakcgroundImg"
|
||||
:src="datas.bakcgroundImg"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
src="../../../assets/images/backimg.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 店铺信息 -->
|
||||
<div class="storIinformation">
|
||||
<div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="datas.headPortrait"
|
||||
:src="datas.headPortrait"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
src="../../../assets/images/headerimg.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p
|
||||
style="
|
||||
margin-top: 5px;
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
line-height: 40px;
|
||||
border-bottom: 1px solid #fff;
|
||||
"
|
||||
>
|
||||
{{ datas.name }}
|
||||
</p>
|
||||
<p style="font-size: 12px; margin-top: 10px">{{ datas.Discount }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'storeinformation',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.storeinformation {
|
||||
position: relative;
|
||||
|
||||
/* 类型一 */
|
||||
.type0 {
|
||||
width: 100%;
|
||||
background-repeat: round;
|
||||
position: relative;
|
||||
height: 185px;
|
||||
/* 蒙版 */
|
||||
.men {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 店铺信息 */
|
||||
.storIinformation {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 110px;
|
||||
display: flex;
|
||||
z-index: 3;
|
||||
|
||||
img {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin-left: 15px;
|
||||
margin-right: 10px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
p {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menban {
|
||||
position: absolute;
|
||||
left: 0p;
|
||||
top: 0px;
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* 类型二 */
|
||||
.type1 {
|
||||
width: 100%;
|
||||
background-repeat: round;
|
||||
position: relative;
|
||||
height: 238px;
|
||||
/* 蒙版 */
|
||||
.men {
|
||||
width: 100%;
|
||||
height: 185px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 店铺信息 */
|
||||
.storIinformation {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 150px;
|
||||
display: flex;
|
||||
z-index: 3;
|
||||
|
||||
img {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
margin-left: 15px;
|
||||
margin-right: 10px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
p {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 类型四 */
|
||||
.type3 {
|
||||
width: 100%;
|
||||
background-repeat: round;
|
||||
position: relative;
|
||||
height: 238px;
|
||||
/* 蒙版 */
|
||||
.men {
|
||||
width: 100%;
|
||||
height: 140px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 店铺信息 */
|
||||
.storIinformation {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 100px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
z-index: 3;
|
||||
|
||||
img {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
margin-left: 15px;
|
||||
margin-right: 10px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
p {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 类型五 */
|
||||
.type4 {
|
||||
width: 100%;
|
||||
background-repeat: round;
|
||||
position: relative;
|
||||
height: 250px;
|
||||
/* 蒙版 */
|
||||
.men {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 店铺信息 */
|
||||
.storIinformation {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
z-index: 3;
|
||||
|
||||
img {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
margin-left: 15px;
|
||||
margin-right: 10px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
p {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
521
src/components/componentscom/storenotecard/index.vue
Normal file
521
src/components/componentscom/storenotecard/index.vue
Normal file
@ -0,0 +1,521 @@
|
||||
<template>
|
||||
<div class="storenotecard">
|
||||
<!-- 更多 -->
|
||||
<div class="more1">
|
||||
<h4>{{ datas.name }}</h4>
|
||||
<p v-show="datas.viewMore1">查看更多 <van-icon name="arrow" /></p>
|
||||
</div>
|
||||
|
||||
<!-- 没有视频展示默认 -->
|
||||
<section
|
||||
v-show="!datas.imageList[0]"
|
||||
:class="[datas.commodityType === 2 ? 'defaultcommodityList2' : '']"
|
||||
class="defaultcommodity"
|
||||
>
|
||||
<div
|
||||
v-for="index in 3"
|
||||
:key="index"
|
||||
class="defaultcommodityList"
|
||||
:class="[
|
||||
datas.commodityType === 0 ? 'defaultcommodityList0' : '',
|
||||
datas.commodityType === 1 ? 'defaultcommodityList1' : '',
|
||||
datas.commodityType === 2 ? 'defaultcommodityList2' : '',
|
||||
datas.commodityType === 3 ? 'defaultcommodityList3' : '',
|
||||
datas.commodityType === 4 ? 'defaultcommodityList4' : '',
|
||||
datas.commodityType === 5 ? 'defaultcommodityList5' : '',
|
||||
]"
|
||||
:style="{
|
||||
'border-radius': datas.borderRadius + 'px',
|
||||
border: datas.moditystyle === 2 ? '1px solid rgba(50,50,51,0.1)' : '',
|
||||
'box-shadow':
|
||||
datas.moditystyle === 1 ? '0 2px 8px rgba(93,113,127,0.08)' : '',
|
||||
width:
|
||||
datas.commodityType === 1
|
||||
? 50 - datas.commodityMargin / 6 + '%'
|
||||
: datas.commodityType === 2
|
||||
? 33 - datas.commodityMargin / 5 + '%'
|
||||
: datas.commodityType === 4
|
||||
? 50 - datas.commodityMargin / 5 + '%'
|
||||
: '',
|
||||
}"
|
||||
>
|
||||
<!-- 视频图片 -->
|
||||
<div
|
||||
class="imgss"
|
||||
style="position: relative; width: 100%"
|
||||
:class="[datas.positions === 'top' ? 'containoptions' : '']"
|
||||
>
|
||||
<img draggable="false" src="../../../assets/images/imgs.png" alt="" />
|
||||
<!-- 标签 -->
|
||||
<p class="marks" v-if="datas.noteLabels"><span>#</span>笔记标签</p>
|
||||
</div>
|
||||
|
||||
<!-- 文字内容 -->
|
||||
<div
|
||||
class="text"
|
||||
:class="[datas.positions === 'top' ? 'positionsTop' : '']"
|
||||
:style="{ background: datas.moditystyle !== 3 ? '#fff' : 'none' }"
|
||||
>
|
||||
<!-- 视频名称 -->
|
||||
<h5>这里显示商品名称，最多显示2行</h5>
|
||||
<!-- 点赞和阅读量 -->
|
||||
<div class="dianz">
|
||||
<span class="fir" v-if="datas.readingNumber">999 阅读</span>
|
||||
<span v-else></span>
|
||||
<span v-show="datas.praisePoints"
|
||||
><van-icon name="good-job-o" /> 999</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
v-show="datas.imageList[0]"
|
||||
:class="[datas.commodityType === 2 ? 'defaultcommodityList2' : '']"
|
||||
class="defaultcommodity"
|
||||
>
|
||||
<div
|
||||
v-for="(item, index) in datas.imageList"
|
||||
:key="index"
|
||||
class="defaultcommodityList"
|
||||
:class="[
|
||||
datas.commodityType === 0 ? 'defaultcommodityList0' : '',
|
||||
datas.commodityType === 1 ? 'defaultcommodityList1' : '',
|
||||
datas.commodityType === 2 ? 'defaultcommodityList2' : '',
|
||||
datas.commodityType === 3 ? 'defaultcommodityList3' : '',
|
||||
datas.commodityType === 4 ? 'defaultcommodityList4' : '',
|
||||
datas.commodityType === 5 ? 'defaultcommodityList5' : '',
|
||||
]"
|
||||
:style="{
|
||||
'border-radius': datas.borderRadius + 'px',
|
||||
border: datas.moditystyle === 2 ? '1px solid rgba(50,50,51,0.1)' : '',
|
||||
'box-shadow':
|
||||
datas.moditystyle === 1 ? '0 2px 8px rgba(93,113,127,0.08)' : '',
|
||||
width:
|
||||
datas.commodityType === 1
|
||||
? 50 - datas.commodityMargin / 6 + '%'
|
||||
: datas.commodityType === 2
|
||||
? 33 - datas.commodityMargin / 5 + '%'
|
||||
: datas.commodityType === 4
|
||||
? 50 - datas.commodityMargin / 5 + '%'
|
||||
: '',
|
||||
}"
|
||||
>
|
||||
<!-- 视频图片 -->
|
||||
<div
|
||||
class="imgss"
|
||||
style="position: relative; width: 100%"
|
||||
:class="[datas.positions === 'top' ? 'containoptions' : '']"
|
||||
>
|
||||
<img draggable="false" :src="item.src" alt="" />
|
||||
<!-- 标签 -->
|
||||
<p class="marks" v-if="datas.noteLabels"><span>#</span>笔记标签</p>
|
||||
</div>
|
||||
|
||||
<!-- 文字内容 -->
|
||||
<div
|
||||
class="text"
|
||||
:class="[datas.positions === 'top' ? 'positionsTop' : '']"
|
||||
:style="{ background: datas.moditystyle !== 3 ? '#fff' : 'none' }"
|
||||
>
|
||||
<!-- 视频名称 -->
|
||||
<h5>{{ item.text }}</h5>
|
||||
<!-- 点赞和阅读量 -->
|
||||
<div class="dianz">
|
||||
<span class="fir" v-if="datas.readingNumber">999 阅读</span>
|
||||
<span v-else></span>
|
||||
<span v-show="datas.praisePoints"
|
||||
><van-icon name="good-job-o" /> 999</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<p class="more2" v-show="datas.viewMore2">
|
||||
查看更多 <van-icon name="arrow" />
|
||||
</p>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'storenotecard',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
active: 0,
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.initImageList()
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 初始化更新imageList数据
|
||||
initImageList() {
|
||||
this.datas.imageList = this.$utils.replaceImageList(this.datas.imageList)
|
||||
console.log(this.datas.imageList, '------------created imageList')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.storenotecard {
|
||||
position: relative;
|
||||
|
||||
/* 更多1 */
|
||||
.more1 {
|
||||
margin: 15px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
h4 {
|
||||
font-size: 16px;
|
||||
color: #323233;
|
||||
font-weight: 400;
|
||||
width: 270px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
p {
|
||||
color: #969799;
|
||||
font-size: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
/* 更多2 */
|
||||
.more2 {
|
||||
text-align: center;
|
||||
color: #969799;
|
||||
font-size: 12px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
/* 默认商品 */
|
||||
.defaultcommodity {
|
||||
box-sizing: border-box;
|
||||
margin: 1px;
|
||||
padding: 0 15px;
|
||||
/* 横向滑动 */
|
||||
&.defaultcommodityList2 {
|
||||
overflow: scroll;
|
||||
display: flex;
|
||||
/* 滚动条 */
|
||||
&::-webkit-scrollbar {
|
||||
height: 1px;
|
||||
}
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: #155bd4;
|
||||
}
|
||||
/deep/.el-collapse-item__header,
|
||||
/deep/.el-collapse-item__wrap {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
/* 卡片列表 */
|
||||
.defaultcommodityList {
|
||||
position: relative;
|
||||
margin-bottom: 15px;
|
||||
overflow: hidden;
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
|
||||
/* 大图模式 */
|
||||
&.defaultcommodityList0 {
|
||||
width: 100%;
|
||||
/* 标签 */
|
||||
.containoptions {
|
||||
.marks {
|
||||
bottom: 33px;
|
||||
z-index: 3;
|
||||
}
|
||||
}
|
||||
img {
|
||||
height: 147px;
|
||||
}
|
||||
/* 文字在图片中 */
|
||||
.positionsTop {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
background: none !important;
|
||||
background-image: linear-gradient(
|
||||
to bottom,
|
||||
transparent,
|
||||
rgba(0, 0, 0, 0.5)
|
||||
) !important;
|
||||
/* 标题 */
|
||||
h5 {
|
||||
color: #fff;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
span {
|
||||
color: #fff;
|
||||
}
|
||||
/* 点赞和阅读量 */
|
||||
.dianz {
|
||||
padding-left: 190px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 一行两个 */
|
||||
&.defaultcommodityList1 {
|
||||
width: 48%;
|
||||
&:nth-of-type(even) {
|
||||
margin-left: 4%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 横向滑动 */
|
||||
&.defaultcommodityList2 {
|
||||
width: 150px;
|
||||
flex: none;
|
||||
margin-right: 5%;
|
||||
}
|
||||
|
||||
/* 一大两小 */
|
||||
&.defaultcommodityList3 {
|
||||
display: flex;
|
||||
&:nth-of-type(3n-2) {
|
||||
margin-bottom: 0 !important;
|
||||
.marks {
|
||||
bottom: 33px;
|
||||
z-index: 3;
|
||||
}
|
||||
img {
|
||||
height: 147px;
|
||||
}
|
||||
/* 文字在图片中 */
|
||||
.text {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
background: none !important;
|
||||
background-image: linear-gradient(
|
||||
to bottom,
|
||||
transparent,
|
||||
rgba(0, 0, 0, 0.5)
|
||||
) !important;
|
||||
/* 标题 */
|
||||
h5 {
|
||||
color: #fff;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
span {
|
||||
color: #fff;
|
||||
}
|
||||
/* 点赞和阅读量 */
|
||||
.dianz {
|
||||
padding-left: 190px;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:nth-of-type(3n) {
|
||||
flex-direction: row-reverse;
|
||||
margin-bottom: 15px;
|
||||
.imgss {
|
||||
width: 65px !important;
|
||||
height: 67px;
|
||||
z-index: 99;
|
||||
position: absolute !important;
|
||||
top: 10%;
|
||||
right: 10px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.marks {
|
||||
left: 0;
|
||||
background: #fff;
|
||||
opacity: 0.85;
|
||||
bottom: 0;
|
||||
}
|
||||
.text {
|
||||
width: 100%;
|
||||
padding: 10px 80px 10px 10px;
|
||||
min-height: 87px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.dianz {
|
||||
justify-content: start;
|
||||
line-height: 20px;
|
||||
span {
|
||||
&.fir {
|
||||
margin-right: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&:nth-of-type(3n-1) {
|
||||
flex-direction: row-reverse;
|
||||
margin-bottom: 0;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
border-top: 1px solid #e5e5e5;
|
||||
.marks {
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
background: #fff;
|
||||
opacity: 0.85;
|
||||
}
|
||||
.imgss {
|
||||
width: 65px !important;
|
||||
height: 67px;
|
||||
z-index: 99;
|
||||
position: absolute !important;
|
||||
top: 10%;
|
||||
right: 10px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.text {
|
||||
width: 100%;
|
||||
padding: 10px 80px 10px 10px;
|
||||
min-height: 87px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
.dianz {
|
||||
justify-content: start;
|
||||
line-height: 20px;
|
||||
span {
|
||||
&.fir {
|
||||
margin-right: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&:nth-of-type(3n) {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
}
|
||||
|
||||
/* 详细列表 */
|
||||
&.defaultcommodityList4 {
|
||||
width: 100%;
|
||||
flex-direction: row-reverse;
|
||||
margin-bottom: 15px;
|
||||
.imgss {
|
||||
width: 120px !important;
|
||||
height: 122px;
|
||||
z-index: 99;
|
||||
position: absolute !important;
|
||||
top: 8%;
|
||||
right: 10px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.marks {
|
||||
left: 0;
|
||||
background: #fff;
|
||||
opacity: 0.85;
|
||||
bottom: 0;
|
||||
}
|
||||
.text {
|
||||
width: 100%;
|
||||
padding: 10px 160px 10px 10px;
|
||||
min-height: 145px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.dianz {
|
||||
justify-content: start;
|
||||
line-height: 20px;
|
||||
span {
|
||||
&.fir {
|
||||
margin-right: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 标签 */
|
||||
.marks {
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
left: 13px;
|
||||
font-size: 10px;
|
||||
padding: 2px 5px;
|
||||
background: #fff;
|
||||
opacity: 0.85;
|
||||
border-radius: 3px;
|
||||
span {
|
||||
color: #d40;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
img {
|
||||
width: 100%;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* 文字 */
|
||||
.text {
|
||||
padding: 10px 10px 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
/* 商品名称 */
|
||||
h5 {
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
margin: 0 0 5px;
|
||||
font-weight: 400;
|
||||
width: 100%;
|
||||
display: -webkit-box;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
/* 点赞和阅读量 */
|
||||
.dianz {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
line-height: 35px;
|
||||
span {
|
||||
font-size: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.van-icon-good-job-o {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
45
src/components/componentscom/suspension/index.vue
Normal file
45
src/components/componentscom/suspension/index.vue
Normal file
@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<div id="suspension">
|
||||
<div class="suspension-wrap">
|
||||
<img
|
||||
class="suspension-logo"
|
||||
src="https://imgs.starfirelink.com/vue-fire-start-h5/shop-peison/icon_back_36.png"
|
||||
/>
|
||||
</div>
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'suspension',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
#suspension {
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
position: relative;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 10%;
|
||||
z-index: 999;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
.suspension-wrap {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
z-index: 1001;
|
||||
.suspension-logo {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
99
src/components/componentscom/tabBar/index.vue
Normal file
99
src/components/componentscom/tabBar/index.vue
Normal file
@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<div class="tabBar">
|
||||
<div v-if="datas.iconList.length !== 0" class="tabbar">
|
||||
<van-tabbar
|
||||
v-model="active"
|
||||
:fixed="false"
|
||||
:placeholder="true"
|
||||
:border="datas.isShowBorder"
|
||||
:active-color="datas.activeColor"
|
||||
:inactive-color="datas.inactiveColor"
|
||||
>
|
||||
<van-tabbar-item
|
||||
v-for="(item, index) in datas.iconList"
|
||||
:key="index"
|
||||
:name="item.iconName"
|
||||
:icon="item.iconPic"
|
||||
:dot="item.isDot"
|
||||
>{{ item.iconText }}</van-tabbar-item
|
||||
>
|
||||
</van-tabbar>
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
<van-tabbar
|
||||
v-model="datas.Highlight"
|
||||
:fixed="false"
|
||||
:placeholder="true"
|
||||
:border="datas.isShowBorder"
|
||||
:active-color="datas.activeColor"
|
||||
:inactive-color="datas.inactiveColor"
|
||||
>
|
||||
<van-tabbar-item icon="search" dot name="home">标签</van-tabbar-item>
|
||||
<van-tabbar-item icon="home-o">标签</van-tabbar-item>
|
||||
<van-tabbar-item icon="friends-o">标签</van-tabbar-item>
|
||||
<van-tabbar-item icon="setting-o">标签</van-tabbar-item>
|
||||
<van-tabbar-item icon="setting-o">标签</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
</div>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'tabBar',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// active: 'home',
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
console.log(this.datas, '--------------tabbar data created')
|
||||
document.querySelector('.phone-container').style.cssText =
|
||||
'padding-bottom: 50px'
|
||||
},
|
||||
|
||||
mounted() {},
|
||||
|
||||
methods: {},
|
||||
|
||||
computed: {},
|
||||
|
||||
watch: {},
|
||||
|
||||
beforeDestroy() {
|
||||
document.querySelector('.phone-container').style.cssText =
|
||||
'padding-bottom: 0px'
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.tabBar {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tabbar {
|
||||
/deep/ .van-icon {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
76
src/components/componentscom/videoss/index.vue
Normal file
76
src/components/componentscom/videoss/index.vue
Normal file
@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<div class="videoss">
|
||||
<!-- 默认视频 -->
|
||||
<section class="default" v-if="!datas.videoData">
|
||||
<van-icon name="tv-o" size="150px" />
|
||||
</section>
|
||||
|
||||
<!-- 选择视频后 -->
|
||||
<section v-else style="min-height: 200px; position: relative">
|
||||
<!-- 视频封面 -->
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.videoData.coverUrl"
|
||||
alt=""
|
||||
style="width: 100%; display: block"
|
||||
/>
|
||||
<!-- 图标 -->
|
||||
<van-icon class="bof" name="play-circle-o" />
|
||||
</section>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'videoss',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
|
||||
created() {
|
||||
this.initImageList()
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 初始化更新imageList数据
|
||||
initImageList() {
|
||||
if (this.datas.videoData) {
|
||||
let shopCommodity = JSON.parse(localStorage.getItem('shopCommodity'))
|
||||
this.datas.videoData =
|
||||
shopCommodity[this.datas.videoData.type][this.datas.videoData.id]
|
||||
console.log(this.datas.videoData, '------------created imageList')
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.videoss {
|
||||
position: relative;
|
||||
|
||||
/* 默认视频 */
|
||||
.default {
|
||||
width: 100%;
|
||||
height: 210px;
|
||||
background: #979797;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 播放图标 */
|
||||
.bof {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 100px;
|
||||
opacity: 0.5;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
73
src/components/componentscom/voicer/index.vue
Normal file
73
src/components/componentscom/voicer/index.vue
Normal file
@ -0,0 +1,73 @@
|
||||
<template>
|
||||
<div class="voicer">
|
||||
<!-- 默认音频 -->
|
||||
<section class="default" v-if="!datas.voicerData">
|
||||
<van-icon name="music-o" size="150px" />
|
||||
</section>
|
||||
|
||||
<!-- 选择音频后 -->
|
||||
<section v-else style="min-height: 200px; position: relative">
|
||||
<!-- 音频封面 -->
|
||||
<img
|
||||
draggable="false"
|
||||
:src="datas.voicerData.coverUrl"
|
||||
alt=""
|
||||
style="width: 100%; display: block"
|
||||
/>
|
||||
<!-- 图标 -->
|
||||
<van-icon class="bof" name="music-o" />
|
||||
</section>
|
||||
|
||||
<!-- 删除组件 -->
|
||||
<slot name="deles" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'voicer',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
created() {
|
||||
this.initImageList()
|
||||
},
|
||||
methods: {
|
||||
// 初始化更新imageList数据
|
||||
initImageList() {
|
||||
if (this.datas.voicerData) {
|
||||
let shopCommodity = JSON.parse(localStorage.getItem('shopCommodity'))
|
||||
this.datas.voicerData =
|
||||
shopCommodity[this.datas.voicerData.type][this.datas.voicerData.id]
|
||||
console.log(this.datas.voicerData, '------------created imageList')
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.voicer {
|
||||
position: relative;
|
||||
/* 默认音频 */
|
||||
.default {
|
||||
width: 100%;
|
||||
height: 210px;
|
||||
background: #979797;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 播放图标 */
|
||||
.bof {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 100px;
|
||||
opacity: 0.5;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
191
src/components/createTemplate/index.vue
Normal file
191
src/components/createTemplate/index.vue
Normal file
@ -0,0 +1,191 @@
|
||||
<template>
|
||||
<div class="createTemplate">
|
||||
<!-- 上传图片 -->
|
||||
<el-dialog
|
||||
class="uploadIMG"
|
||||
title="选择页面模板"
|
||||
:lock-scroll="true"
|
||||
:visible.sync="dialogVisible"
|
||||
:close-on-click-modal="false"
|
||||
width="860px"
|
||||
>
|
||||
<!-- 内容 -->
|
||||
<el-tabs v-model="activeName" width="100%" @tab-click="handleClick">
|
||||
<el-tab-pane label="系统页模板" name="0">
|
||||
<!-- 模板列表 -->
|
||||
<section class="templateList">
|
||||
<div class="entyTemplate">
|
||||
<i
|
||||
class="el-icon-circle-plus-outline"
|
||||
style="
|
||||
font-size: 45px;
|
||||
color: #fff;
|
||||
background: rgb(217, 220, 223, 0.5);
|
||||
border-radius: 50%;
|
||||
"
|
||||
/>
|
||||
<p style="margin-top: 10px; font-size: 14px; color: #7d7e80">
|
||||
使用空白模板
|
||||
</p>
|
||||
<!-- 进入事件 -->
|
||||
<div class="hove">
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="$router.push({ path: 'home' })"
|
||||
>使用模板</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<div v-for="(item, index) in dtList" :key="index">
|
||||
<section class="templateList">
|
||||
<!-- <i class="el-icon-circle-plus-outline" style="font-size: 45px;color: #fff;background: rgb(217, 220, 223, .5);border-radius: 50%;" />-->
|
||||
<van-image
|
||||
width="100%"
|
||||
height="320px"
|
||||
fit="scale-down"
|
||||
:src="item.imgUrl"
|
||||
/>
|
||||
<p style="margin-top: 10px; font-size: 14px; color: #7d7e80">
|
||||
{{ item.name }}
|
||||
</p>
|
||||
<!-- 进入事件 -->
|
||||
<div class="hove">
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="
|
||||
$router.push({ path: 'home?id=' + item.id + '&type=tpl' })
|
||||
"
|
||||
>使用模板</el-button
|
||||
>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
|
||||
<!-- <el-tab-pane label="行业模板" name="1">行业模板</el-tab-pane>
|
||||
<el-tab-pane label="活动/节日模板" name="2">活动/节日模板</el-tab-pane>
|
||||
<el-tab-pane label="主页模板" name="3">主页模板</el-tab-pane>
|
||||
<el-tab-pane label="我的模板" name="4">我的模板</el-tab-pane> -->
|
||||
</el-tabs>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'createTemplate',
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false, //弹框默认隐藏
|
||||
activeName: '0', //tab选项
|
||||
dtList: [],
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadDefaultTemplate()
|
||||
},
|
||||
methods: {
|
||||
/* 显示弹框 */
|
||||
showExtension() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
// 关闭弹框
|
||||
handleClose() {
|
||||
// 隐藏上传文件
|
||||
this.dialogVisible = false
|
||||
},
|
||||
/* tab切换 */
|
||||
handleClick(tab, event) {
|
||||
console.log(tab, event)
|
||||
},
|
||||
loadDefaultTemplate() {
|
||||
this.$httpApi.defaultTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
console.log(res)
|
||||
this.dtList = res.data.defaultTemplateList
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import '../../assets/css/minx.less';
|
||||
.createTemplate {
|
||||
/* tab */
|
||||
/deep/.el-tabs__nav-wrap .is-top {
|
||||
padding: 0 40px !important;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
/deep/.el-dialog__title {
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
// 上传弹框内容部分
|
||||
/deep/.uploadIMG .el-dialog__body {
|
||||
min-height: 280px;
|
||||
/deep/.el-tabs__content {
|
||||
min-height: 380px;
|
||||
}
|
||||
/deep/.el-tabs__nav-scroll {
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
/deep/.el-tab-pane {
|
||||
overflow-x: scroll;
|
||||
display: flex;
|
||||
padding: 10px;
|
||||
/* 模板列表 */
|
||||
.templateList {
|
||||
width: 184px;
|
||||
height: 380px;
|
||||
position: relative;
|
||||
transition: all 1s;
|
||||
transform: translateY(0);
|
||||
margin-top: 10px;
|
||||
margin-left: 20px;
|
||||
border-radius: 4px 4px 0 0;
|
||||
border: 1px solid #f2f2f2;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
|
||||
.entyTemplate {
|
||||
width: 185px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.hove {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
transform: translateY(-5px);
|
||||
margin-top: -10px;
|
||||
/* 进入事件 */
|
||||
.hove {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
289
src/components/extension/index.vue
Normal file
289
src/components/extension/index.vue
Normal file
@ -0,0 +1,289 @@
|
||||
<template>
|
||||
<div class="extension">
|
||||
<!-- 上传图片 -->
|
||||
<el-dialog
|
||||
class="uploadIMG"
|
||||
title="推广"
|
||||
:lock-scroll="true"
|
||||
:visible.sync="dialogVisible"
|
||||
:close-on-click-modal="false"
|
||||
width="646px"
|
||||
>
|
||||
<!-- 内容 -->
|
||||
<section class="container">
|
||||
<img :src="poster" style="width: 280px; height: 450px" alt="" />
|
||||
|
||||
<!-- 二维码 -->
|
||||
<img
|
||||
ref="qrcodeImg"
|
||||
:src="qrcodeData"
|
||||
id="qrcode"
|
||||
style="width: 235px; height: 235px; position: absolute; z-index: -999"
|
||||
/>
|
||||
|
||||
<!-- 操作 -->
|
||||
<div class="text">
|
||||
<div style="margin: 0 0 20px 0">
|
||||
<span style="font-size: 14px; margin-right: 10px">选择海报：</span>
|
||||
<el-select v-model="selectType" size="mini" @change="templatetype">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.title"
|
||||
:value="item.id"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<p class="top">复制推广链接</p>
|
||||
|
||||
<!-- 复制内容 -->
|
||||
<div class="cilp">
|
||||
<span id="foo">{{ URL }}</span>
|
||||
<el-button
|
||||
size="small"
|
||||
data-clipboard-target="#foo"
|
||||
id="btn"
|
||||
data-clipboard-action="copy"
|
||||
type="primary"
|
||||
>复制</el-button
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- 下载图片 -->
|
||||
<p class="operation">
|
||||
<span @click="downloadPoster">下载完整海报</span>
|
||||
<span @click="downloadqrcode">仅下载二维码</span>
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Clipboard from 'clipboard'
|
||||
import QRCode from 'qrcode'
|
||||
|
||||
export default {
|
||||
name: 'extension',
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false, //弹框默认隐藏
|
||||
activeName: '0', //tab选项
|
||||
URL: '', //页面链接
|
||||
qrcodeData: '', //二维码base64
|
||||
poster: '', //海报链接
|
||||
selectType: '', //下拉框
|
||||
options: [], // 海报类型选择
|
||||
templateId: '', //当前页面id
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.clipboard()
|
||||
},
|
||||
methods: {
|
||||
/* 显示弹框 */
|
||||
showExtension(res, isHome) {
|
||||
// 默认模板
|
||||
this.poster = res.posterUrl
|
||||
this.templateId = res.id
|
||||
console.log(res, isHome,'-----------------showExtension')
|
||||
if (isHome) {
|
||||
console.log(res, isHome,'-----------------showExtension')
|
||||
this.URL = `${this.$baseURL}#/shop?orgId=${res.userAdminId}`
|
||||
} else {
|
||||
this.URL = `${this.$baseURL}#/shop?id=${res.id}&orgId=${res.userAdminId}`
|
||||
}
|
||||
|
||||
QRCode.toDataURL(this.URL)
|
||||
.then((url) => {
|
||||
this.qrcodeData = url
|
||||
})
|
||||
.catch((err) => {
|
||||
console.error(err)
|
||||
})
|
||||
this.dialogVisible = true
|
||||
// 获取模板
|
||||
this.selectDataApi()
|
||||
},
|
||||
|
||||
// 获取海报模板
|
||||
selectDataApi() {
|
||||
this.$httpApi.selectData().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.posterList
|
||||
this.selectType = res.data.posterList[0].title
|
||||
// 没有默认模板请求
|
||||
if (!this.poster) {
|
||||
this.getPoster(res.data.posterList[0].id)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 获取海报
|
||||
getPoster(id) {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: '海报加载中...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)',
|
||||
})
|
||||
this.$httpApi
|
||||
.poster({
|
||||
posterId: id,
|
||||
shopTemplateId: this.templateId,
|
||||
path: this.URL,
|
||||
})
|
||||
.then((res) => {
|
||||
loading.close()
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.$message({
|
||||
message: '海报加载成功',
|
||||
type: 'success',
|
||||
})
|
||||
this.poster = res.data.url
|
||||
})
|
||||
},
|
||||
|
||||
// 选择模板类型
|
||||
templatetype(res) {
|
||||
this.getPoster(res)
|
||||
},
|
||||
|
||||
// 关闭弹框
|
||||
handleClose() {
|
||||
// 隐藏上传文件
|
||||
this.dialogVisible = false
|
||||
},
|
||||
|
||||
/* 复制 */
|
||||
clipboard() {
|
||||
const clipboard = new Clipboard('#btn')
|
||||
clipboard.on('success', (e) => {
|
||||
this.$message({
|
||||
message: '复制成功',
|
||||
type: 'success',
|
||||
})
|
||||
e.clearSelection()
|
||||
})
|
||||
clipboard.on('error', () => {
|
||||
this.$message.error('复制失败')
|
||||
})
|
||||
},
|
||||
|
||||
/* 下载二维码 */
|
||||
downloadqrcode() {
|
||||
var link = document.createElement('a')
|
||||
link.setAttribute('href', this.qrcodeData)
|
||||
link.setAttribute('download', '星火.png')
|
||||
link.click()
|
||||
},
|
||||
|
||||
// 下载海报
|
||||
downloadPoster() {
|
||||
this.getUrlBase64(this.poster).then((base64) => {
|
||||
let link = document.createElement('a')
|
||||
link.href = base64
|
||||
link.download = '星火海报.png'
|
||||
link.click()
|
||||
})
|
||||
},
|
||||
getUrlBase64(url) {
|
||||
return new Promise((resolve) => {
|
||||
let canvas = document.createElement('canvas')
|
||||
let ctx = canvas.getContext('2d')
|
||||
let img = new Image()
|
||||
img.crossOrigin = 'Anonymous' //允许跨域
|
||||
img.src = url
|
||||
img.onload = function () {
|
||||
canvas.height = 720
|
||||
canvas.width = 400
|
||||
ctx.drawImage(img, 0, 0, 400, 720)
|
||||
let dataURL = canvas.toDataURL('image/png')
|
||||
canvas = null
|
||||
resolve(dataURL)
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import '../../assets/css/minx.less';
|
||||
.extension {
|
||||
position: relative;
|
||||
|
||||
/deep/.el-dialog__title {
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
// 上传弹框内容部分
|
||||
/deep/.uploadIMG .el-dialog__body {
|
||||
min-height: 280px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
|
||||
/* 内容 */
|
||||
.container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
|
||||
/* 操作 */
|
||||
.text {
|
||||
margin-left: 12px;
|
||||
.top {
|
||||
font-size: 12px;
|
||||
color: #333;
|
||||
}
|
||||
/* 复制 */
|
||||
.cilp {
|
||||
display: flex;
|
||||
margin-top: 20px;
|
||||
#foo {
|
||||
width: 245px;
|
||||
cursor: no-drop;
|
||||
padding: 0 10px;
|
||||
border: 1px solid #e5e5e5;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
background: #f8f8f8;
|
||||
opacity: 0.5;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
/* 下载图片 */
|
||||
.operation {
|
||||
margin-top: 20px;
|
||||
span {
|
||||
color: #38f;
|
||||
padding: 0 5px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
&:first-of-type {
|
||||
border-right: 1px solid #e5e5e5;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.disable {
|
||||
/deep/.el-upload {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
73
src/components/phoneBottom/index.vue
Normal file
73
src/components/phoneBottom/index.vue
Normal file
@ -0,0 +1,73 @@
|
||||
<template>
|
||||
<div class="phoneBottom">
|
||||
<p class="ft-links" v-show="datas.isShowBootom">
|
||||
<span>店铺主页</span>
|
||||
<span>个人中心</span>
|
||||
<!-- <span>关注我们</span> -->
|
||||
<!-- <span>店铺信息</span> -->
|
||||
</p>
|
||||
<!-- <img
|
||||
draggable="false"
|
||||
v-show="datas.botLogo"
|
||||
:src="datas.botLogo"
|
||||
style="width: 110px; margin-left: 35%; margin-top: 10px"
|
||||
/> -->
|
||||
<p class="yinjia" :style="{ 'margin-top': datas ? '0px' : '10px' }">
|
||||
<img
|
||||
draggable="false"
|
||||
class="logo"
|
||||
src="@/assets/images/Robot.png"
|
||||
/><span>星火相连提供技术支持</span>
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'phoneBottom',
|
||||
props:['datas'],
|
||||
watch: {
|
||||
datas() {
|
||||
// console.log(this.datas,'------------this.datas')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.phoneBottom {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
min-height: 145px;
|
||||
cursor: pointer;
|
||||
padding-top: 30px;
|
||||
box-sizing: border-box;
|
||||
.ft-links {
|
||||
text-align: center;
|
||||
padding: 0px 15px 10px;
|
||||
span {
|
||||
padding: 0 6px;
|
||||
color: #666;
|
||||
font-size: 12px;
|
||||
border-right: 1px solid #e5e5e5;
|
||||
&:last-of-type {
|
||||
border-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.yinjia {
|
||||
color: #bfbfc3;
|
||||
text-align: center;
|
||||
font-size: 11px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.logo {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
229
src/components/rightslider/auxiliarysegmentationstyle/index.vue
Normal file
229
src/components/rightslider/auxiliarysegmentationstyle/index.vue
Normal file
@ -0,0 +1,229 @@
|
||||
<template>
|
||||
<div class="auxiliarysegmentationstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="80px" :model="datas" size="small">
|
||||
<!-- 空白高度 -->
|
||||
<el-form-item label="空白高度" class="lef">
|
||||
<el-slider
|
||||
v-model="datas.blankHeight"
|
||||
:max="100"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 20px" />
|
||||
|
||||
<!-- 分割类型 -->
|
||||
<el-form-item class="lef" label="分割类型">
|
||||
<div class="weiz">
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="index - 1 === 0 ? '辅助空白' : '辅助线'"
|
||||
placement="bottom"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<i
|
||||
class="iconfont"
|
||||
:class="[
|
||||
index - 1 === 0
|
||||
? 'icon-fuzhukongbai_weixuanzhong'
|
||||
: 'icon-fuzhuxiantiao',
|
||||
datas.segmentationtype === index - 1 ? 'active' : '',
|
||||
]"
|
||||
@click="datas.segmentationtype = index - 1"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 20px" />
|
||||
|
||||
<!-- 选择样式 -->
|
||||
<el-form-item
|
||||
v-show="datas.segmentationtype === 1"
|
||||
class="lef"
|
||||
label="选择样式"
|
||||
>
|
||||
<div class="weiz">
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="item.text"
|
||||
placement="bottom"
|
||||
v-for="(item, index) in borderType"
|
||||
:key="index"
|
||||
>
|
||||
<i
|
||||
class="iconfont"
|
||||
:class="[item.icon, datas.bordertp === item.type ? 'active' : '']"
|
||||
@click="datas.bordertp = item.type"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<div v-show="datas.segmentationtype === 1" style="height: 20px" />
|
||||
|
||||
<!-- 左右边距 -->
|
||||
<el-form-item
|
||||
v-show="datas.segmentationtype === 1"
|
||||
class="lef"
|
||||
label="左右边距"
|
||||
>
|
||||
<div class="weiz">
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="index - 1 === 0 ? '无边距' : '左右留边'"
|
||||
placement="bottom"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<i
|
||||
class="iconfont"
|
||||
:class="[
|
||||
index - 1 === 0
|
||||
? 'icon-icon_wubianju'
|
||||
: 'icon-icon_zuoyoubianju',
|
||||
datas.paddType === index - 1 ? 'active' : '',
|
||||
]"
|
||||
@click="datas.paddType = index - 1"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<div v-show="datas.segmentationtype === 1" style="height: 20px" />
|
||||
|
||||
<!-- 辅助线颜色 -->
|
||||
<el-form-item
|
||||
v-show="datas.segmentationtype === 1"
|
||||
label="辅助线颜色"
|
||||
class="lef aa"
|
||||
>
|
||||
<!-- 辅助线颜色 -->
|
||||
<el-color-picker
|
||||
v-model="datas.auxliarColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'auxiliarysegmentationstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
borderType: [
|
||||
//线类型
|
||||
{
|
||||
icon: 'icon-icon_fengexian_shixian',
|
||||
text: '实线',
|
||||
type: 'solid',
|
||||
},
|
||||
{
|
||||
icon: 'icon-xuxian',
|
||||
text: '虚线',
|
||||
type: 'dashed',
|
||||
},
|
||||
{
|
||||
icon: 'icon-dianxian--',
|
||||
text: '点线',
|
||||
type: 'dotted',
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.auxiliarysegmentationstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
.aa {
|
||||
/deep/.el-form-item__label {
|
||||
width: 100px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* 颜色选择器 */
|
||||
.picke {
|
||||
float: right;
|
||||
}
|
||||
|
||||
/* 图片样式 */
|
||||
.weiz {
|
||||
text-align: right;
|
||||
i {
|
||||
padding: 5px 14px;
|
||||
margin-left: 10px;
|
||||
border-radius: 0;
|
||||
border: 1px solid #ebedf0;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
|
||||
&:last-child {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #155bd4;
|
||||
border: 1px solid #155bd4;
|
||||
background: #e0edff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
367
src/components/rightslider/captiontextsstyle/index.vue
Normal file
367
src/components/rightslider/captiontextsstyle/index.vue
Normal file
@ -0,0 +1,367 @@
|
||||
<template>
|
||||
<section class="captiontextsstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="80px" :model="datas" size="small" :rules="rules">
|
||||
<!-- 标题内容 -->
|
||||
<el-form-item label="标题内容">
|
||||
<el-input
|
||||
v-model="datas.name"
|
||||
placeholder="请输入标题"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 描述内容 -->
|
||||
<el-form-item label="描述内容">
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="datas.description"
|
||||
placeholder="请输入要说明的文字，最多 100 字"
|
||||
maxlength="100"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 显示位置 -->
|
||||
<el-form-item label="显示位置">
|
||||
<div class="weiz">
|
||||
<i
|
||||
:class="datas.positions === 'left' ? 'active' : ''"
|
||||
class="iconfont icon-horizontal-left"
|
||||
@click="datas.positions = 'left'"
|
||||
/>
|
||||
<i
|
||||
:class="datas.positions === 'center' ? 'active' : ''"
|
||||
class="iconfont icon-juzhong"
|
||||
@click="datas.positions = 'center'"
|
||||
/>
|
||||
<!-- <i
|
||||
:class="datas.positions === 'right' ? 'active': ''"
|
||||
class="iconfont icon-juyou"
|
||||
@click="datas.positions = 'right'"
|
||||
/> -->
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 标题大小 -->
|
||||
<el-form-item
|
||||
label="标题大小"
|
||||
prop="wordSize"
|
||||
:hide-required-asterisk="true"
|
||||
>
|
||||
<el-input
|
||||
type="number"
|
||||
v-model.number="datas.wordSize"
|
||||
placeholder="请输入标题文字大小"
|
||||
:maxlength="2"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 描述大小 -->
|
||||
<el-form-item
|
||||
label="描述大小"
|
||||
prop="descriptionSize"
|
||||
:hide-required-asterisk="true"
|
||||
>
|
||||
<el-input
|
||||
type="number"
|
||||
v-model.number="datas.descriptionSize"
|
||||
placeholder="请输入描述文字大小"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 标题粗细 -->
|
||||
<el-form-item
|
||||
label="标题粗细"
|
||||
prop="wordWeight"
|
||||
:hide-required-asterisk="true"
|
||||
>
|
||||
<el-input
|
||||
type="number"
|
||||
v-model.number="datas.wordWeight"
|
||||
placeholder="请输入标题粗细"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!--描述粗细 -->
|
||||
<el-form-item
|
||||
label="描述粗细"
|
||||
prop="descriptionWeight"
|
||||
:hide-required-asterisk="true"
|
||||
>
|
||||
<el-input
|
||||
type="number"
|
||||
v-model.number="datas.descriptionWeight"
|
||||
placeholder="请输入描述粗细"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 框体高度 -->
|
||||
<el-form-item class="lef" label="框体高度">
|
||||
<el-slider
|
||||
v-model="datas.wordHeight"
|
||||
:max="100"
|
||||
:min="20"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 标题颜色 -->
|
||||
<el-form-item label="标题颜色">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.wordColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 描述颜色 -->
|
||||
<el-form-item label="描述颜色">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.descriptionColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 背景颜色 -->
|
||||
<el-form-item label="背景颜色">
|
||||
<!-- 背景颜色 -->
|
||||
<el-color-picker
|
||||
v-model="datas.backColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!--查看更多 -->
|
||||
<el-form-item label="底部分割线" class="wid">
|
||||
{{ datas.borderBott ? '显示' : '隐藏' }}
|
||||
<el-checkbox v-model="datas.borderBott" />
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!--查看更多 -->
|
||||
<el-form-item label="查看更多" class="wid">
|
||||
{{ datas.more.show ? '显示' : '隐藏' }}
|
||||
<el-checkbox v-model="datas.more.show" />
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 更多样式选择 -->
|
||||
<div v-show="datas.more.show ? true : false">
|
||||
<el-radio-group v-model="datas.more.type">
|
||||
<el-radio :label="0">样式一</el-radio>
|
||||
<el-radio :label="1">样式二</el-radio>
|
||||
<el-radio :label="2">样式三</el-radio>
|
||||
</el-radio-group>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 更多文字 -->
|
||||
<el-input
|
||||
v-show="datas.more.type === 2 ? false : true"
|
||||
type="text"
|
||||
style="width: 110px; margin: 15px"
|
||||
v-model="datas.more.text"
|
||||
size="mini"
|
||||
/>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 跳转链接 -->
|
||||
<el-form-item label="跳转链接">
|
||||
<!-- <el-radio-group v-model="datas.more.httpType" style="margin-left: 18px">
|
||||
<el-radio :label="0">方式一</el-radio>
|
||||
<el-radio :label="1">方式二</el-radio>
|
||||
</el-radio-group> -->
|
||||
|
||||
<!-- 输入http -->
|
||||
<el-input
|
||||
v-show="datas.more.httpType === 0"
|
||||
v-model="datas.more.http"
|
||||
placeholder="请输入跳转链接: http://www...."
|
||||
show-word-limit
|
||||
style="margin-top: 10px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- 选择创建好的页面 -->
|
||||
<el-select
|
||||
style="margin-top: 10px"
|
||||
@change="changeId"
|
||||
@visible-change="getOption"
|
||||
v-show="datas.more.httpType === 1"
|
||||
v-model="datas.more.select.name"
|
||||
placeholder="请选择要跳转的页面"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</el-form>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'captiontextsstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
let checkAge = (rule, value, callback) => {
|
||||
if (value.length === 0) callback(new Error('请输入有效数字'))
|
||||
if (value > 99) callback(new Error('数字最大为99'))
|
||||
}
|
||||
let kon = (rule, value, callback) => {
|
||||
if (value.length === 0) callback(new Error('请输入有效数字'))
|
||||
}
|
||||
return {
|
||||
options: [],
|
||||
rules: {
|
||||
wordSize: [{ required: true, validator: checkAge, trigger: 'blur' }],
|
||||
descriptionSize: [
|
||||
{ required: true, validator: checkAge, trigger: 'blur' },
|
||||
],
|
||||
wordWeight: [{ required: true, validator: kon, trigger: 'blur' }],
|
||||
descriptionWeight: [
|
||||
{ required: true, validator: kon, trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/* 获取下拉框内容 */
|
||||
getOption() {
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
})
|
||||
},
|
||||
changeId(res) {
|
||||
this.datas.more.select = {
|
||||
name: res.name,
|
||||
id: res.id,
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.captiontextsstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
/* 颜色选择器 */
|
||||
.picke {
|
||||
float: right;
|
||||
}
|
||||
|
||||
/* 位置 */
|
||||
.weiz {
|
||||
text-align: right;
|
||||
i {
|
||||
padding: 5px 14px;
|
||||
margin-left: 10px;
|
||||
border-radius: 0;
|
||||
border: 1px solid #ebedf0;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
|
||||
&:last-child {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #155bd4;
|
||||
border: 1px solid #155bd4;
|
||||
background: #e0edff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.wid .el-form-item__label {
|
||||
width: 94px !important;
|
||||
}
|
||||
/deep/.wid .el-form-item__content {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
326
src/components/rightslider/commoditysearchstyle/index.vue
Normal file
326
src/components/rightslider/commoditysearchstyle/index.vue
Normal file
@ -0,0 +1,326 @@
|
||||
<template>
|
||||
<div class="commoditysearchstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<p style="color: #323233; font-size: 14px">搜索热词</p>
|
||||
<p style="font-size: 12px; color: #969799; margin-top: 10px">
|
||||
鼠标拖拽调整热词顺序，搜索框默认展示第一个热词，其他搜索词将以标签形式显示在搜索页中
|
||||
</p>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="80px" :model="datas" size="small">
|
||||
<div v-if="datas.hotords[0]">
|
||||
<vuedraggable v-model="datas.hotords" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<section
|
||||
class="imgList"
|
||||
v-for="(item, index) in datas.hotords"
|
||||
:key="item + index"
|
||||
>
|
||||
<i class="el-icon-circle-close" @click="deleteHotords(index)" />
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgText">
|
||||
<el-input v-model="item.text" placeholder="请输入热词" />
|
||||
</div>
|
||||
</section>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
</div>
|
||||
|
||||
<!-- 添加热词 -->
|
||||
<el-button @click="addHotords" class="uploadImg" type="primary" plain
|
||||
><i class="el-icon-plus" />点击添加热词</el-button
|
||||
>
|
||||
|
||||
<div style="height: 20px" />
|
||||
|
||||
<!-- 显示位置 -->
|
||||
<el-form-item class="lef" label="显示位置">
|
||||
<div class="weiz">
|
||||
<span>{{
|
||||
datas.position === 0 ? '正常模式' : '滚动至顶部固定'
|
||||
}}</span>
|
||||
<div>
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="index - 1 === 0 ? '正常模式' : '滚动至顶部固定'"
|
||||
placement="bottom"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<i
|
||||
class="iconfont"
|
||||
:class="[
|
||||
index - 1 === 0 ? 'icon-wangye1' : 'icon-zhiding',
|
||||
datas.position === index - 1 ? 'active' : '',
|
||||
]"
|
||||
@click="datas.position = index - 1"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 框体样式 -->
|
||||
<el-form-item class="lef" label="框体样式">
|
||||
<div class="weiz">
|
||||
<span>{{ datas.borderRadius === 0 ? '方形' : '圆形' }}</span>
|
||||
<div>
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="index - 1 === 0 ? '方形' : '圆形'"
|
||||
placement="bottom"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<i
|
||||
class="iconfont"
|
||||
:class="[
|
||||
index - 1 === 0 ? 'icon-sousuokuang1' : 'icon-sousuokuang',
|
||||
datas.borderRadius === index - 1 ? 'active' : '',
|
||||
]"
|
||||
@click="datas.borderRadius = index - 1"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 文本位置 -->
|
||||
<el-form-item class="lef" label="文本位置">
|
||||
<div class="weiz">
|
||||
<span>{{ datas.textPosition === 0 ? '居左' : '居中' }}</span>
|
||||
<div>
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="index - 1 === 0 ? '居左' : '居中'"
|
||||
placement="bottom"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<i
|
||||
class="iconfont"
|
||||
:class="[
|
||||
index - 1 === 0 ? 'icon-horizontal-left' : 'icon-juzhong',
|
||||
datas.textPosition === index - 1 ? 'active' : '',
|
||||
]"
|
||||
@click="datas.textPosition = index - 1"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 扫一扫 -->
|
||||
<el-form-item class="lef" label="扫一扫">
|
||||
{{ datas.sweep ? '显示' : '隐藏' }}
|
||||
<el-checkbox style="margin-left: 196px" v-model="datas.sweep" />
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 框体高度 -->
|
||||
<el-form-item label="框体高度" class="lef borrediu">
|
||||
<el-slider
|
||||
v-model="datas.heights"
|
||||
:max="50"
|
||||
:min="28"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 背景颜色 -->
|
||||
<el-form-item class="lef" label="背景颜色">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.backgroundColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 框体颜色 -->
|
||||
<el-form-item class="lef" label="框体颜色">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.borderColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 文本颜色 -->
|
||||
<el-form-item class="lef" label="文本颜色">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.textColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vuedraggable from 'vuedraggable' //拖拽组件
|
||||
|
||||
export default {
|
||||
name: 'commoditysearchstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
components: { vuedraggable },
|
||||
data() {
|
||||
return {
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
dragOptions: {
|
||||
//拖拽配置
|
||||
animation: 200,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/* 添加热词 */
|
||||
addHotords() {
|
||||
this.datas.hotords.push({
|
||||
text: '',
|
||||
})
|
||||
},
|
||||
/* 删除热词 */
|
||||
deleteHotords(index) {
|
||||
this.datas.hotords.splice(index, 1)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.commoditysearchstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
/* 上传图片按钮 */
|
||||
.uploadImg {
|
||||
width: 345px;
|
||||
height: 40px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/* 热词列表 */
|
||||
.imgList {
|
||||
padding: 6px 12px;
|
||||
margin: 16px 7px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
/* 删除图标 */
|
||||
.el-icon-circle-close {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
/* 热词文字 */
|
||||
.imgText {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片样式 */
|
||||
.weiz {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
i {
|
||||
padding: 5px 14px;
|
||||
margin-left: 10px;
|
||||
border-radius: 0;
|
||||
border: 1px solid #ebedf0;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
|
||||
&:last-child {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #155bd4;
|
||||
border: 1px solid #155bd4;
|
||||
background: #e0edff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* 颜色选择器 */
|
||||
.picke {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
221
src/components/rightslider/communitypowderstyle/index.vue
Normal file
221
src/components/rightslider/communitypowderstyle/index.vue
Normal file
@ -0,0 +1,221 @@
|
||||
<template>
|
||||
<div class="communitypowderstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<div style="height: 20px" />
|
||||
|
||||
<!-- 提示 -->
|
||||
<!-- <el-tooltip class="item" effect="dark" content="" placement="bottom">
|
||||
<div slot="content">活码是用户推广个人微信号或粉丝群的二维码，适用于线上线下，吸引用户<br/>添加好友或粉丝群进行长期维护的场景</div>
|
||||
<i class="el-icon-question" style="cursor: pointer;"></i>
|
||||
</el-tooltip> -->
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form
|
||||
label-position="top"
|
||||
label-width="80px"
|
||||
:model="datas"
|
||||
size="small"
|
||||
:rules="rules"
|
||||
>
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 描述 -->
|
||||
<el-form-item label="入口图片" :hide-required-asterisk="true">
|
||||
<div class="backgroundImg" @click="showImg('mainImg')">
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="!datas.mainImg"
|
||||
src="../../../assets/images/powder.png"
|
||||
alt=""
|
||||
/>
|
||||
<img draggable="false" v-else :src="datas.mainImg" alt="" />
|
||||
<p>更换图片</p>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 二维码 -->
|
||||
<el-form-item label="二维码" :hide-required-asterisk="true">
|
||||
<div class="backgroundImg" @click="showImg('qrcodeImg')">
|
||||
<i class="el-icon-plus" v-if="!datas.qrcodeImg" size="30"></i>
|
||||
<img draggable="false" v-else :src="datas.qrcodeImg" alt="" />
|
||||
<p>更换图片</p>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 标题 -->
|
||||
<el-form-item label="标题" prop="title" :hide-required-asterisk="true">
|
||||
<el-input
|
||||
v-model="datas.title"
|
||||
placeholder="个人微信号, 群名称或活动标题"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 描述 -->
|
||||
<el-form-item label="描述" prop="describe" :hide-required-asterisk="true">
|
||||
<el-input
|
||||
v-model="datas.describe"
|
||||
placeholder="请添加描述"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 按钮名称 -->
|
||||
<el-form-item
|
||||
label="按钮名称"
|
||||
prop="buttonName"
|
||||
:hide-required-asterisk="true"
|
||||
>
|
||||
<el-input
|
||||
v-model="datas.buttonName"
|
||||
placeholder="请输入按钮名称"
|
||||
show-word-limit
|
||||
maxlength="8"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 背景颜色 -->
|
||||
<el-form-item label="背景颜色" class="color-select">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.backColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
|
||||
export default {
|
||||
name: 'communitypowderstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
rules: {
|
||||
title: [
|
||||
//页面名称
|
||||
{ required: true, message: '请输入标题', trigger: 'blur' },
|
||||
],
|
||||
describe: [
|
||||
// 描述
|
||||
{ required: true, message: '请输入描述', trigger: 'blur' },
|
||||
],
|
||||
buttonName: [
|
||||
// 按钮名称
|
||||
{ required: true, message: '请输入按钮名称', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
imgText: '', //哪一个图片
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 提交
|
||||
uploadInformation(res) {
|
||||
this.datas[this.imgText] = res
|
||||
},
|
||||
showImg(res) {
|
||||
this.imgText = res
|
||||
this.$refs.upload.showUpload()
|
||||
},
|
||||
},
|
||||
components: { uploadimg },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.communitypowderstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
/* 颜色选择器 */
|
||||
.picke {
|
||||
margin-left: 15px;
|
||||
vertical-align: top;
|
||||
}
|
||||
/* 背景图 */
|
||||
.backgroundImg {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
position: relative;
|
||||
background: #f2f4f6;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
p {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
text-align: center;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
.color-select {
|
||||
/deep/.el-form-item__content {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
106
src/components/rightslider/componenmanagement/index.vue
Normal file
106
src/components/rightslider/componenmanagement/index.vue
Normal file
@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<div class="componenManagement">
|
||||
<!-- 标题 -->
|
||||
<h2>组件设置</h2>
|
||||
|
||||
<!-- 拖拽 -->
|
||||
<vuedraggable v-model="data" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<div v-for="(item, ind) in data" :key="item.text + ind" class="item">
|
||||
<p>
|
||||
<i class="el-icon-s-grid" style="margin-right: 15px" />{{
|
||||
item.text
|
||||
}}
|
||||
</p>
|
||||
<el-popconfirm
|
||||
title="您确定要删除该组件吗?"
|
||||
icon="el-icon-warning"
|
||||
iconColor="red"
|
||||
@confirm="onConfirms(ind)"
|
||||
>
|
||||
<i
|
||||
class="el-icon-delete-solid"
|
||||
slot="reference"
|
||||
style="cursor: pointer"
|
||||
/>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vuedraggable from 'vuedraggable' //拖拽组件
|
||||
|
||||
export default {
|
||||
name: 'componenManagement',
|
||||
props: ['datas'],
|
||||
components: { vuedraggable },
|
||||
data() {
|
||||
return {
|
||||
data: this.datas,
|
||||
dragOptions: {
|
||||
animation: 200,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/* 删除组件 */
|
||||
onConfirms(res) {
|
||||
this.data.splice(res, 1)
|
||||
this.$emit('componenmanagement', this.data)
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
datas(newVal) {
|
||||
this.data = newVal
|
||||
},
|
||||
|
||||
data(newVal) {
|
||||
this.$emit('componenmanagement', newVal)
|
||||
},
|
||||
},
|
||||
computed: {},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
/* 组件管理 */
|
||||
.componenManagement {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
/* 选项 */
|
||||
.item {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 10px;
|
||||
font-size: 14px;
|
||||
cursor: all-scroll;
|
||||
color: #323233;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
margin-bottom: 10px;
|
||||
i {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
35
src/components/rightslider/crowdoperationstyle/index.vue
Normal file
35
src/components/rightslider/crowdoperationstyle/index.vue
Normal file
@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<div class="crowdoperationstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'crowdoperationstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.crowdoperationstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
40
src/components/rightslider/custommodulestyle/index.vue
Normal file
40
src/components/rightslider/custommodulestyle/index.vue
Normal file
@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<div class="custommodulestyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
<el-input v-model="datas.demo" placeholder="请输入公告" />
|
||||
<el-input v-model="datas.img" placeholder="图片地址" />
|
||||
{{ 'aaa'+ data-type}}
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'custommodulestyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
'data-type':String,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.custommodulestyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
370
src/components/rightslider/decorate/index.vue
Normal file
370
src/components/rightslider/decorate/index.vue
Normal file
@ -0,0 +1,370 @@
|
||||
<template>
|
||||
<div class="decorate">
|
||||
<!-- 标题 -->
|
||||
<h2>页面设置</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form
|
||||
label-position="top"
|
||||
label-width="80px"
|
||||
:model="datas"
|
||||
:rules="rules"
|
||||
size="small"
|
||||
>
|
||||
<el-form-item label="页面名称" :hide-required-asterisk="true" prop="name">
|
||||
<el-input
|
||||
v-model="datas.name"
|
||||
placeholder="页面标题"
|
||||
maxlength="25"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item
|
||||
label="页面描述"
|
||||
:hide-required-asterisk="true"
|
||||
prop="details"
|
||||
>
|
||||
<el-input
|
||||
v-model="datas.details"
|
||||
placeholder="用户通过微信分享给朋友时，会自动显示页面描述"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 个人中心 -->
|
||||
<el-form-item label="个人中心" class="lef">
|
||||
{{ datas.isPerson ? '显示' : '隐藏' }}
|
||||
<el-checkbox style="margin-left: 196px" v-model="datas.isPerson" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 返回 -->
|
||||
<el-form-item label="返回按钮" class="lef">
|
||||
{{ datas.isBack ? '显示' : '隐藏' }}
|
||||
<el-checkbox style="margin-left: 196px" v-model="datas.isBack" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 高度 -->
|
||||
<el-form-item label="高度" class="lef-height">
|
||||
<el-slider
|
||||
v-model="datas.titleHeight"
|
||||
:max="100"
|
||||
:min="35"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 页面分类 -->
|
||||
<!-- <el-form-item label="分类" :hide-required-asterisk="true" prop="classification">
|
||||
<el-select v-model="datas.classification" placeholder="请选择页面分类">
|
||||
<el-option label="区域一" value="shanghai" />
|
||||
<el-option label="区域二" value="beijing" />
|
||||
</el-select>
|
||||
|
||||
<span class="ification">刷新</span>|<span class="ification">新建</span>
|
||||
</el-form-item> -->
|
||||
|
||||
<!-- 背景颜色 -->
|
||||
<el-form-item label="背景颜色">
|
||||
<!-- 单选框 -->
|
||||
<el-radio-group v-model="colourAction">
|
||||
<el-radio label="默认颜色" />
|
||||
<el-radio label="自定义颜色" />
|
||||
</el-radio-group>
|
||||
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.bgColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
v-show="pickeShow"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="背景图片">
|
||||
<div class="shop-head-pic" style="text-align: center">
|
||||
<img class="home-bg" :src="datas.bgImg" alt="" v-if="datas.bgImg" />
|
||||
<div class="shop-head-pic-btn" style="text-align: center">
|
||||
<el-button
|
||||
@click="showUpload('2')"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
><i class="el-icon-plus" />更换图片</el-button
|
||||
>
|
||||
<el-button type="primary" @click="clear()">清空图片</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="底部LOGO">
|
||||
<div class="bottomLogo">
|
||||
<img :src="datas.bottomLogo.botLogo" alt="" />
|
||||
<el-button
|
||||
@click="showUpload('0')"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
><i class="el-icon-plus" />点击添加图片</el-button
|
||||
>
|
||||
</div>
|
||||
</el-form-item> -->
|
||||
<!-- 底部主页 -->
|
||||
<el-form-item label="店铺主页" class="lef" v-if="datas.bottomLogo">
|
||||
{{ datas.bottomLogo.isShowBootom ? '显示' : '隐藏' }}
|
||||
<el-checkbox
|
||||
style="margin-left: 196px"
|
||||
v-model="datas.bottomLogo.isShowBootom"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 店铺信息 -->
|
||||
<el-form-item label="店铺信息">
|
||||
<div class="shop-info">
|
||||
<div class="shop-name">
|
||||
店铺名称：
|
||||
<el-input
|
||||
v-model="shopData.shopName"
|
||||
@blur="changeShopInfo"
|
||||
></el-input>
|
||||
</div>
|
||||
|
||||
<div class="shop-head-pic">
|
||||
店铺头像:
|
||||
<img :src="shopData.shopPic" alt="" />
|
||||
<div class="shop-head-pic-btn">
|
||||
<el-button
|
||||
@click="showUpload('1')"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
><i class="el-icon-plus" />更换头像</el-button
|
||||
>
|
||||
<!-- <el-button @click="changeShopInfo" type="primary" plain>保存店铺信息</el-button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
|
||||
export default {
|
||||
name: 'decorate',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
rules: {
|
||||
//校验表单输入
|
||||
name: [
|
||||
//页面名称
|
||||
{ required: true, message: '请输入页面名称', trigger: 'blur' },
|
||||
],
|
||||
details: [
|
||||
//页面描述
|
||||
{ required: true, message: '请输入页面描述', trigger: 'blur' },
|
||||
],
|
||||
classification: [
|
||||
//分类
|
||||
{ required: true, message: '请选择页面分类', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
colourAction: '默认颜色', // 颜色选择
|
||||
pickeShow: false, //颜色选择器是否显示
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
shopData: {
|
||||
shopName: null, // 店铺名称
|
||||
shopPic: null, // 店铺头像
|
||||
},
|
||||
uploadImgDataType: null, // 获取到的图片地址属于哪一类别 0 修改底部logo 1 修改店铺图标 2 页面背景图
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.getShopInfo()
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 显示上传图片组件 type : 0 修改底部logo 1 修改店铺图标 2 页面背景图
|
||||
showUpload(type) {
|
||||
this.uploadImgDataType = type
|
||||
this.$refs.upload.showUpload()
|
||||
},
|
||||
|
||||
// 底部logo
|
||||
uploadInformation(res) {
|
||||
if (this.uploadImgDataType === '0') {
|
||||
this.datas.bottomLogo.botLogo = res
|
||||
} else if (this.uploadImgDataType === '1') {
|
||||
this.shopData.shopPic = res
|
||||
this.changeShopInfo()
|
||||
} else if (this.uploadImgDataType === '2') {
|
||||
this.datas.bgImg = res
|
||||
}
|
||||
},
|
||||
|
||||
// 获取店铺信息
|
||||
getShopInfo() {
|
||||
this.$httpApi.queryShopInfo().then((res) => {
|
||||
// console.log('shop info ', res)
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
|
||||
this.shopData.shopName = res.data.name // 店铺名称
|
||||
this.shopData.shopPic = res.data.icon // 店铺头像
|
||||
})
|
||||
},
|
||||
// 清空背景图片
|
||||
clear() {
|
||||
this.datas.bgImg = ''
|
||||
},
|
||||
|
||||
// 修改店铺信息
|
||||
changeShopInfo() {
|
||||
let params = {
|
||||
name: this.shopData.shopName,
|
||||
icon: this.shopData.shopPic,
|
||||
}
|
||||
|
||||
this.$httpApi.updateShopInfo(params).then((res) => {
|
||||
console.log('change shop info ::', res)
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.$message.success(res.msg)
|
||||
})
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
colourAction(data) {
|
||||
if (data === '默认颜色') {
|
||||
this.datas.bgColor = 'rgba(249, 249, 249, 10)'
|
||||
this.pickeShow = false
|
||||
return
|
||||
} else return (this.pickeShow = true)
|
||||
},
|
||||
},
|
||||
components: { uploadimg },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
/* 页面设置 */
|
||||
.decorate {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px;
|
||||
box-sizing: border-box;
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
/* 选择器添加和刷新 */
|
||||
.ification {
|
||||
color: #155bd4;
|
||||
font-size: 14px;
|
||||
padding: 0 15px;
|
||||
cursor: pointer;
|
||||
}
|
||||
/* 颜色选择器 */
|
||||
.picke {
|
||||
margin-left: 15px;
|
||||
vertical-align: top;
|
||||
}
|
||||
.home-bg {
|
||||
width: 100px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.lef {
|
||||
display: flex;
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
.lef-height {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
width: 80px;
|
||||
float: left;
|
||||
}
|
||||
/deep/.el-form-item__content {
|
||||
margin-left: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
// 底部logo
|
||||
.bottomLogo {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
img {
|
||||
display: block;
|
||||
width: 220px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
}
|
||||
|
||||
// 店铺信息修改
|
||||
.shop-info {
|
||||
.shop-name {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
color: #ababab;
|
||||
.el-input {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
.shop-head-pic {
|
||||
color: #ababab;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
img {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
.shop-head-pic-btn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
.el-button {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
222
src/components/rightslider/entertheshopstyle/index.vue
Normal file
222
src/components/rightslider/entertheshopstyle/index.vue
Normal file
@ -0,0 +1,222 @@
|
||||
<template>
|
||||
<div class="entertheshopstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form
|
||||
label-position="top"
|
||||
label-width="80px"
|
||||
:model="datas"
|
||||
:rules="rules"
|
||||
size="small"
|
||||
>
|
||||
<el-form-item
|
||||
label="店铺名称"
|
||||
:hide-required-asterisk="true"
|
||||
prop="shopName"
|
||||
>
|
||||
<el-input
|
||||
v-model="datas.shopName"
|
||||
placeholder="请输入店铺名称"
|
||||
maxlength="10"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 文案 -->
|
||||
<el-form-item
|
||||
label="文案"
|
||||
:hide-required-asterisk="true"
|
||||
prop="copywriting"
|
||||
>
|
||||
<el-input
|
||||
v-model="datas.copywriting"
|
||||
placeholder="请输入文案"
|
||||
maxlength="8"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 跳转页面 -->
|
||||
<el-form-item label="跳转页面">
|
||||
<div class="imgText">
|
||||
<el-select
|
||||
style="width: 60%"
|
||||
v-model="datas.type"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
@change="selectType(index)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in optionsType"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.type"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-model="datas.http.name"
|
||||
v-if="datas.type !== '11'"
|
||||
placeholder="请选择图片跳转链接"
|
||||
size="mini"
|
||||
@change="changeId"
|
||||
:no-data-text="emptyText"
|
||||
@visible-change="
|
||||
(isVisible) => {
|
||||
return changeType(isVisible, datas.type)
|
||||
}
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="[index, item]"
|
||||
:disabled="item.disabled"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
style="width: 100%"
|
||||
v-if="datas.type === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="datas.http.externalLink"
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'entertheshopstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
rules: {
|
||||
//校验表单输入
|
||||
shopName: [
|
||||
//页面名称
|
||||
{ required: true, message: '请输入店铺名称', trigger: 'blur' },
|
||||
],
|
||||
copywriting: [
|
||||
//页面描述
|
||||
{ required: true, message: '请输入文案', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
optionsType: [
|
||||
// {
|
||||
// type: '1',
|
||||
// name: '视频'
|
||||
// },
|
||||
// {
|
||||
// type: '2',
|
||||
// name: '音频'
|
||||
// },
|
||||
// {
|
||||
// type: '6',
|
||||
// name: '直播'
|
||||
// },
|
||||
{
|
||||
type: '10',
|
||||
name: '跳转至历史页面',
|
||||
},
|
||||
{
|
||||
type: '11',
|
||||
name: '外部链接',
|
||||
},
|
||||
], // 选择跳转类型
|
||||
options: [], //后端返回的列表提供下拉选择
|
||||
emptyText: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 选择类型
|
||||
changeType(isVisible, linkType) {
|
||||
if (isVisible && linkType) {
|
||||
this.emptyText = '正在搜索中'
|
||||
if (
|
||||
linkType === '1' ||
|
||||
linkType === '2' ||
|
||||
linkType === '6' ||
|
||||
linkType === '3'
|
||||
) {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: linkType }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
res.data.length === 0 ? (this.emptyText = '暂无数据') : null
|
||||
this.options = res.data
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
} else if (linkType === '10') {
|
||||
// 历史页面
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
// 保存跳转的地方
|
||||
changeId(res) {
|
||||
console.log(res)
|
||||
if (res.component) delete res.component
|
||||
this.datas.http = res
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.entertheshopstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
/* 图片字 */
|
||||
.imgText {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
justify-content: space-between;
|
||||
.fir-sele.el-select {
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
109
src/components/rightslider/followStyle/index.vue
Normal file
109
src/components/rightslider/followStyle/index.vue
Normal file
@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<div id="followStyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<el-form>
|
||||
<el-form-item class="lef" label="公众号图片">
|
||||
<div class="follow-pic">
|
||||
<img :src="datas.heade" alt="" />
|
||||
<el-button
|
||||
@click="$refs.upload.showUpload()"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
>
|
||||
<i class="el-icon-plus" />上传公众号图片
|
||||
</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="lef" label="公众号名称">
|
||||
<input type="text" placeholder="请输入公众号名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="lef" label="公众号Id">
|
||||
<input type="text" placeholder="请输入公众号Id" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
export default {
|
||||
name: 'followStyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
|
||||
created() {
|
||||
console.log(this.datas,'-------------followStyle datas')
|
||||
},
|
||||
|
||||
mounted() {},
|
||||
|
||||
methods: {
|
||||
// 提交
|
||||
uploadInformation(res) {
|
||||
this.datas.heade = res
|
||||
},
|
||||
},
|
||||
|
||||
computed: {},
|
||||
|
||||
watch: {},
|
||||
components: {
|
||||
uploadimg,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
#followStyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.follow-pic {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
img {
|
||||
display: block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.uploadImg {
|
||||
width: 80%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
584
src/components/rightslider/graphicnavigationstyle/index.vue
Normal file
584
src/components/rightslider/graphicnavigationstyle/index.vue
Normal file
@ -0,0 +1,584 @@
|
||||
<template>
|
||||
<div class="graphicnavigationstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 提示 -->
|
||||
<p style="color: #969799; font-size: 12px; margin-top: 10px">
|
||||
拖动选中的导航可对其排序
|
||||
</p>
|
||||
|
||||
<!-- 图片广告 -->
|
||||
<div v-if="datas.imageList[0]">
|
||||
<vuedraggable v-model="datas.imageList" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<section
|
||||
class="imgList"
|
||||
v-for="(item, index) in datas.imageList"
|
||||
:key="item + index"
|
||||
>
|
||||
<i class="el-icon-circle-close" @click="deleteimg(index)" />
|
||||
<!-- 图片 -->
|
||||
<div class="imag">
|
||||
<img draggable="false" :src="item.src" alt="" />
|
||||
</div>
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgText">
|
||||
<el-input
|
||||
v-model="item.text"
|
||||
placeholder="请输入标题，也可不填"
|
||||
size="mini"
|
||||
></el-input>
|
||||
<!-- 选择类型 -->
|
||||
<div class="select-type">
|
||||
<el-select
|
||||
style="width: 60%"
|
||||
v-model="item.linktype"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
@change="selectType(index)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in optionsType"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.type"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-model="item.http.name"
|
||||
v-if="item.linktype !== '11'"
|
||||
placeholder="请选择图片跳转链接"
|
||||
size="mini"
|
||||
@change="changeId"
|
||||
:no-data-text="emptyText"
|
||||
@visible-change="
|
||||
(isVisible) => {
|
||||
return changeType(isVisible, item.linktype)
|
||||
}
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="[index, item]"
|
||||
:disabled="item.disabled"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
style="width: 100%"
|
||||
v-if="item.linktype === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="item.http.externalLink"
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
</div>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<el-button @click="showUpload('0')" class="uploadImg" type="primary" plain
|
||||
><i class="el-icon-plus" />点击添加图片</el-button
|
||||
>
|
||||
|
||||
<div class="bor"></div>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="80px" :model="datas" size="small">
|
||||
<!-- 商品类型选择 -->
|
||||
<el-form-item class="lef" label="商品类型">
|
||||
<el-radio-group v-model="datas.navigationType">
|
||||
<el-radio
|
||||
style="margin-left: 35px"
|
||||
:label="index - 1"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>{{ index === 1 ? '图片导航' : '文字导航' }}</el-radio
|
||||
>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 图片样式 -->
|
||||
<el-form-item class="lef" label="图片样式">
|
||||
<div class="weiz">
|
||||
<el-tooltip
|
||||
effect="dark"
|
||||
:content="index - 1 === 0 ? '固定' : '滑动'"
|
||||
placement="bottom"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<i
|
||||
class="iconfont"
|
||||
:class="[
|
||||
index - 1 === 0 ? 'icon-guding' : 'icon-hengxianghuadong',
|
||||
datas.imgStyle === index - 1 ? 'active' : '',
|
||||
]"
|
||||
@click="datas.imgStyle = index - 1"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 一屏显示 -->
|
||||
<el-form-item class="lef" label="一屏显示" v-show="datas.imgStyle === 1">
|
||||
<el-select
|
||||
v-model="datas.showSize"
|
||||
placeholder="请选择活动区域"
|
||||
style="margin-left: 90px"
|
||||
>
|
||||
<el-option
|
||||
:label="index + 4 + '个导航'"
|
||||
:value="index + 4"
|
||||
v-for="index in 7"
|
||||
:key="index"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 文字高度 -->
|
||||
<el-form-item label="文字高度" class="lef">
|
||||
<el-slider
|
||||
v-model="datas.textHeight"
|
||||
:max="50"
|
||||
:min="24"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 文字大小 -->
|
||||
<el-form-item
|
||||
label="文字大小"
|
||||
prop="textSize"
|
||||
:hide-required-asterisk="true"
|
||||
class="lef"
|
||||
>
|
||||
<el-input
|
||||
type="number"
|
||||
v-model.number="datas.textSize"
|
||||
placeholder="请输入文字大小"
|
||||
:maxlength="2"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 图片倒角 -->
|
||||
<el-form-item label="图片倒角" class="lef borrediu">
|
||||
<el-slider
|
||||
v-model="datas.borderRadius"
|
||||
:max="50"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<el-form-item class="lef" label="背景图片">
|
||||
<div class="shop-head-pic" style="text-align: center">
|
||||
<img class="home-bg" :src="datas.bgImg" alt="" v-if="datas.bgImg" />
|
||||
<div class="shop-head-pic-btn" style="text-align: center">
|
||||
<el-button
|
||||
@click="showUpload('1')"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
><i class="el-icon-plus" />更换图片</el-button
|
||||
>
|
||||
<el-button type="primary" class="uploadImg" @click="clear()"
|
||||
>清空图片</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 背景颜色 -->
|
||||
<el-form-item class="lef" label="背景颜色">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.backgroundColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 文字颜色 -->
|
||||
<el-form-item class="lef" label="文字颜色">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.textColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
import vuedraggable from 'vuedraggable' //拖拽组件
|
||||
|
||||
export default {
|
||||
name: 'graphicnavigationstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dragOptions: {
|
||||
//拖拽配置
|
||||
animation: 200,
|
||||
},
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
optionsType: [
|
||||
{
|
||||
type: '1',
|
||||
name: '视频',
|
||||
},
|
||||
{
|
||||
type: '2',
|
||||
name: '书籍',
|
||||
},
|
||||
{
|
||||
type: '3',
|
||||
name: '音频',
|
||||
},
|
||||
{
|
||||
type: '6',
|
||||
name: '直播',
|
||||
},
|
||||
{
|
||||
type: '7',
|
||||
name: '实物商品',
|
||||
},
|
||||
{
|
||||
type: '10',
|
||||
name: '跳转至历史页面',
|
||||
},
|
||||
{
|
||||
type: '11',
|
||||
name: '外部链接',
|
||||
},
|
||||
], // 选择跳转类型
|
||||
options: [],
|
||||
emptyText: '',
|
||||
uploadImgDataType: null,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initImageList()
|
||||
},
|
||||
methods: {
|
||||
// 初始化更新imageList数据
|
||||
initImageList() {
|
||||
this.datas.imageList = this.$utils.replaceImageList(this.datas.imageList)
|
||||
console.log(this.datas.imageList, '------------created imageList')
|
||||
},
|
||||
showUpload(type) {
|
||||
this.uploadImgDataType = type
|
||||
this.$refs.upload.showUpload()
|
||||
},
|
||||
// 提交
|
||||
uploadInformation(res) {
|
||||
if (this.uploadImgDataType === '0') {
|
||||
this.datas.imageList.push({
|
||||
src: res,
|
||||
text: '',
|
||||
http: {},
|
||||
})
|
||||
} else if (this.uploadImgDataType === '1') {
|
||||
this.datas.bgImg = res
|
||||
}
|
||||
},
|
||||
|
||||
// 清空背景图片
|
||||
clear() {
|
||||
this.datas.bgImg = ''
|
||||
},
|
||||
/* 删除图片列表的图片 */
|
||||
deleteimg(index) {
|
||||
this.datas.imageList.splice(index, 1)
|
||||
},
|
||||
|
||||
selectType(index) {
|
||||
// 每次切换类型之前 清空之前选中跳转
|
||||
this.datas.imageList[index].http = {}
|
||||
|
||||
// 清空 options
|
||||
this.options = []
|
||||
},
|
||||
|
||||
changeId(res) {
|
||||
// 商品类型只匹配 1 2 3 6
|
||||
if (
|
||||
this.$utils.coursewareMetchArr.includes(
|
||||
this.datas.imageList[res[0]].linktype
|
||||
)
|
||||
) {
|
||||
console.log('-----------1')
|
||||
// 查询本地动态数据 然后再赋值
|
||||
let dynamic = this.$utils.getCoursewareData(
|
||||
this.datas.imageList[res[0]].linktype,
|
||||
res[1].id
|
||||
)
|
||||
this.datas.imageList[res[0]].http = dynamic
|
||||
} else {
|
||||
console.log('-----------2')
|
||||
this.datas.imageList[res[0]].http = res[1]
|
||||
}
|
||||
this.datas.imageList.forEach((item) => {
|
||||
if (item.http.component) {
|
||||
item.http.component = ''
|
||||
}
|
||||
})
|
||||
console.log(this.datas.imageList, '-----------------------save data')
|
||||
},
|
||||
|
||||
// 选择类型
|
||||
changeType(isVisible, linkType) {
|
||||
if (isVisible && linkType) {
|
||||
this.emptyText = '正在搜索中'
|
||||
|
||||
if (
|
||||
linkType === '1' ||
|
||||
linkType === '2' ||
|
||||
linkType === '6' ||
|
||||
linkType === '3' ||
|
||||
linkType === '7'
|
||||
) {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: linkType }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
res.data.length === 0 ? (this.emptyText = '暂无数据') : null
|
||||
this.options = res.data
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
} else if (linkType === '10') {
|
||||
// 历史页面
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
console.log(this.options, '----------this.options')
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
components: { uploadimg, vuedraggable },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.graphicnavigationstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* 上传图片按钮 */
|
||||
.uploadImg {
|
||||
width: 345px;
|
||||
height: 40px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/* 商品列表 */
|
||||
.imgList {
|
||||
padding: 6px 12px;
|
||||
margin: 16px 7px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
/* 删除图标 */
|
||||
.el-icon-circle-close {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
.imag {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片字 */
|
||||
.imgText {
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
justify-content: space-between;
|
||||
.select-type {
|
||||
display: flex;
|
||||
/deep/.el-select {
|
||||
.el-input {
|
||||
input {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片样式 */
|
||||
.weiz {
|
||||
text-align: right;
|
||||
i {
|
||||
padding: 5px 14px;
|
||||
margin-left: 10px;
|
||||
border-radius: 0;
|
||||
border: 1px solid #ebedf0;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
|
||||
&:last-child {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #155bd4;
|
||||
border: 1px solid #155bd4;
|
||||
background: #e0edff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shop-head-pic {
|
||||
color: #ababab;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.home-bg {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
.shop-head-pic-btn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
.el-button {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 颜色选择器 */
|
||||
.picke {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
25
src/components/rightslider/index.js
Normal file
25
src/components/rightslider/index.js
Normal file
@ -0,0 +1,25 @@
|
||||
export { default as decorate } from './decorate'
|
||||
export { default as componenmanagement } from './componenmanagement'
|
||||
export { default as captiontextsstyle } from './captiontextsstyle'
|
||||
export { default as pictureadsstyle } from './pictureadsstyle'
|
||||
export { default as graphicnavigationstyle } from './graphicnavigationstyle'
|
||||
export { default as richtextstyle } from './richtextstyle'
|
||||
export { default as magiccubestyle } from './magiccubestyle'
|
||||
export { default as auxiliarysegmentationstyle } from './auxiliarysegmentationstyle'
|
||||
export { default as commoditysearchstyle } from './commoditysearchstyle'
|
||||
export { default as storeinformationstyle } from './storeinformationstyle'
|
||||
export { default as entertheshopstyle } from './entertheshopstyle'
|
||||
export { default as noticestyle } from './noticestyle'
|
||||
export { default as videostyle } from './videostyle'
|
||||
export { default as voicerstyle } from './voicerstyle'
|
||||
export { default as custommodulestyle } from './custommodulestyle'
|
||||
export { default as communitypowderstyle } from './communitypowderstyle'
|
||||
export { default as storenotecardstyle } from './storenotecardstyle'
|
||||
export { default as crowdoperationstyle } from './crowdoperationstyle'
|
||||
export { default as personalizedrecommendationstyle } from './personalizedrecommendationstyle'
|
||||
export { default as onlineservicestyle } from './onlineservicestyle'
|
||||
export { default as listswitchingstyle } from './listswitchingstyle'
|
||||
export { default as investigatestyle } from './investigatestyle'
|
||||
export { default as tabBarStyle } from './tabBarStyle'
|
||||
export { default as followStyle } from './followStyle'
|
||||
export { default as suspensionstyle } from './suspensionstyle'
|
||||
175
src/components/rightslider/investigatestyle/index.vue
Normal file
175
src/components/rightslider/investigatestyle/index.vue
Normal file
@ -0,0 +1,175 @@
|
||||
<template>
|
||||
<div class="investigatestyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 内容 -->
|
||||
<div>
|
||||
<p class="info" style="color: #ff0000">
|
||||
下拉框，单选，多选等文本用，符号隔开#如：(男#女)
|
||||
</p>
|
||||
</div>
|
||||
<!-- <el-from ref="form" :model="datas" label-width="80px">
|
||||
|
||||
</el-from>-->
|
||||
<el-form ref="form" :model="datas" label-width="80px">
|
||||
<el-form-item label="名称" label-width="40px">
|
||||
<el-input v-model="datas.title" style="width: 87%"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-for="(item, index) in datas.jsonData"
|
||||
:key="index"
|
||||
class="lef"
|
||||
>
|
||||
<span class="delete" @click="deletetext(index)">x</span>
|
||||
<el-input
|
||||
v-model="item.name"
|
||||
class="title"
|
||||
placeholder="调研名称"
|
||||
></el-input>
|
||||
<el-select
|
||||
v-model="item.type"
|
||||
placeholder="请选择显示格式"
|
||||
@change="conChange(index)"
|
||||
>
|
||||
<el-option
|
||||
:label="item"
|
||||
:value="index"
|
||||
v-for="(item, index) in selecttext"
|
||||
:key="index"
|
||||
></el-option>
|
||||
</el-select>
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="item.value"
|
||||
placeholder="提示语句如:(请输入姓名)"
|
||||
v-if="item.type == 0"
|
||||
></el-input>
|
||||
<el-input
|
||||
type="textarea"
|
||||
v-model="item.value"
|
||||
@input="item.value1 = item.value.split('#')"
|
||||
placeholder="多项之间用‘#’逗号隔开"
|
||||
v-else
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="addText" class="uploadImg" type="primary" plain>
|
||||
<i class="el-icon-plus" />点击添加内容
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'investigatestyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
selecttext: ['文本', '下拉框', '单选', '多选'],
|
||||
index1: 0,
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
//添加文本
|
||||
addText() {
|
||||
console.log(this.datas.jsonData)
|
||||
var text = {
|
||||
name: '',
|
||||
type: '',
|
||||
value: '',
|
||||
value1: [],
|
||||
value2: '',
|
||||
showPicker: false,
|
||||
}
|
||||
this.datas.jsonData.push(text)
|
||||
},
|
||||
//删除文本
|
||||
deletetext(index) {
|
||||
this.datas.jsonData.splice(index, 1)
|
||||
},
|
||||
//下拉内容改变发生发生事件
|
||||
conChange(index) {
|
||||
this.datas.jsonData[index].value = ''
|
||||
this.datas.jsonData[index].value1 = []
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.investigatestyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
.lef {
|
||||
position: relative;
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
.delete {
|
||||
background: #ff0000;
|
||||
color: #ffffff;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.el-form-item__content {
|
||||
margin-left: 0 !important;
|
||||
// display: flex;
|
||||
div {
|
||||
&:nth-child(2) {
|
||||
// flex: 1;
|
||||
width: 90%;
|
||||
margin-right: 2%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
&:nth-child(3) {
|
||||
width: 90%;
|
||||
// flex: 1;
|
||||
}
|
||||
&:nth-child(4) {
|
||||
width: 100%;
|
||||
margin-top: 5px;
|
||||
// flex: 3;
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 上传图片按钮 */
|
||||
.uploadImg {
|
||||
width: 345px;
|
||||
height: 40px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
// /deep/.el-input__inner{
|
||||
// padding: 0 5px;
|
||||
// }
|
||||
</style>
|
||||
872
src/components/rightslider/listswitchingstyle/index.vue
Normal file
872
src/components/rightslider/listswitchingstyle/index.vue
Normal file
@ -0,0 +1,872 @@
|
||||
<template>
|
||||
<div class="listswitchingstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="80px" :model="datas" size="small" :rules="rules">
|
||||
<!-- 标题内容 -->
|
||||
<el-form-item
|
||||
class="lef"
|
||||
label="选择模板"
|
||||
v-show="datas.commoditylisttype !== 2"
|
||||
>
|
||||
<p style="color: #000">{{ styleText }}</p>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 商品样式选择 -->
|
||||
<div class="commodityType" v-show="datas.commoditylisttype !== 2">
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
:content="item.content"
|
||||
placement="bottom"
|
||||
v-for="(item, index) in commodityTypes"
|
||||
:key="index"
|
||||
>
|
||||
<span
|
||||
class="iconfont"
|
||||
style="font-size: 21px"
|
||||
:class="[
|
||||
item.type === datas.commodityType ? 'active' : '',
|
||||
item.icon,
|
||||
]"
|
||||
@click="datas.commodityType = index"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
||||
<!-- 下划线 -->
|
||||
<div class="bor" v-show="datas.commoditylisttype !== 2" />
|
||||
|
||||
<!-- 商品类型选择 -->
|
||||
<el-form-item label="商品类型" class="lef">
|
||||
<el-radio-group v-model="datas.commoditylisttype">
|
||||
<el-radio :label="index - 1" v-for="index in 3" :key="index"
|
||||
>类型{{ index }}</el-radio
|
||||
>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<!-- tabbar颜色 -->
|
||||
<el-form-item
|
||||
label="标签颜色"
|
||||
class="lef"
|
||||
v-show="datas.commoditylisttype !== 0"
|
||||
>
|
||||
<el-color-picker
|
||||
v-model="datas.tabColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 更多 -->
|
||||
<el-form-item label="更多" class="lef">
|
||||
{{ datas.showMore ? '显示' : '隐藏' }}
|
||||
<el-checkbox style="margin-left: 196px" v-model="datas.showMore" />
|
||||
<el-select
|
||||
v-model="datas.moreUrl"
|
||||
v-show="datas.showMore"
|
||||
placeholder="请选择更多跳转链接"
|
||||
size="mini"
|
||||
@visible-change="getOption"
|
||||
@change="selectMore"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="[item.id, item.name]"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<div v-show="datas.commoditylisttype === 0">
|
||||
<h5 style="color: #000; font-size: 14px">添加商品</h5>
|
||||
<p style="color: #969799; font-size: 12px; margin-top: 10px">
|
||||
鼠标拖拽调整商品顺序
|
||||
</p>
|
||||
|
||||
<!-- 图片广告 -->
|
||||
<div v-if="datas.imageList[0]">
|
||||
<vuedraggable v-model="datas.imageList" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<section
|
||||
class="imgBanner"
|
||||
v-for="(item, index) in datas.imageList"
|
||||
:key="item + index"
|
||||
>
|
||||
<i class="el-icon-circle-close" @click="deleteimg(index)" />
|
||||
<div class="imag">
|
||||
<img draggable="false" :src="item.coverUrl" alt="" />
|
||||
</div>
|
||||
<div class="imgText">
|
||||
<div>
|
||||
<el-input
|
||||
disabled="disabled"
|
||||
style="width: 65%"
|
||||
v-model="item.name"
|
||||
size="mini"
|
||||
/>
|
||||
<el-input
|
||||
disabled="disabled"
|
||||
type="number"
|
||||
style="width: 35%"
|
||||
v-model.number="item.price"
|
||||
size="mini"
|
||||
/>
|
||||
</div>
|
||||
<el-input
|
||||
disabled="disabled"
|
||||
v-model="item.introduce"
|
||||
size="mini"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
</div>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<el-button
|
||||
@click="dialogVisibleshow('imageList', null)"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
><i class="el-icon-plus" />点击添加商品</el-button
|
||||
>
|
||||
</div>
|
||||
|
||||
<div v-show="datas.commoditylisttype !== 0">
|
||||
<h5 style="color: #000; font-size: 14px; margin-left: 7px">
|
||||
添加商品分组<el-button
|
||||
style="padding: 2px 4px; fnot-size: 12px; margin-left: 200px"
|
||||
@click="addGrouping"
|
||||
type="primary"
|
||||
size="mini"
|
||||
plain
|
||||
>
|
||||
<i class="el-icon-plus" />添加</el-button
|
||||
>
|
||||
</h5>
|
||||
<p
|
||||
style="
|
||||
color: #969799;
|
||||
font-size: 12px;
|
||||
margin-left: 7px;
|
||||
margin-top: 10px;
|
||||
"
|
||||
>
|
||||
鼠标拖拽调整分组顺序
|
||||
</p>
|
||||
|
||||
<!-- 分类名称 -->
|
||||
<section
|
||||
v-for="(item, index) in datas.commoditylisttypetab"
|
||||
:key="index"
|
||||
>
|
||||
<div class="bor" />
|
||||
|
||||
<el-input
|
||||
v-model="item.text"
|
||||
class="tit"
|
||||
style="width: 100px"
|
||||
placeholder="请输入分组名称"
|
||||
size="mini"
|
||||
/>
|
||||
<i
|
||||
@click="delecommoditylisttypetab(index)"
|
||||
class="el-icon-delete"
|
||||
style="
|
||||
cursor: pointer;
|
||||
padding: 2px 4px;
|
||||
fnot-size: 12px;
|
||||
margin-left: 200px;
|
||||
color: red;
|
||||
"
|
||||
/>
|
||||
|
||||
<vuedraggable v-model="item.imageList" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<section
|
||||
class="imgBanner"
|
||||
v-for="(item, ind) in item.imageList"
|
||||
:key="item + ind"
|
||||
>
|
||||
<i
|
||||
class="el-icon-circle-close"
|
||||
@click="delecommodityimg(index, ind)"
|
||||
/>
|
||||
<!-- 图片 -->
|
||||
<div class="imag">
|
||||
<img draggable="false" :src="item.coverUrl" alt="" />
|
||||
</div>
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgText">
|
||||
<div>
|
||||
<el-input
|
||||
disabled="disabled"
|
||||
style="width: 65%"
|
||||
v-model="item.name"
|
||||
size="mini"
|
||||
/>
|
||||
<el-input
|
||||
disabled="disabled"
|
||||
type="number"
|
||||
style="width: 35%"
|
||||
v-model.number="item.price"
|
||||
size="mini"
|
||||
/>
|
||||
</div>
|
||||
<el-input
|
||||
disabled="disabled"
|
||||
v-model="item.introduce"
|
||||
size="mini"
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
|
||||
<el-button
|
||||
@click="dialogVisibleshow('commoditylisttypetab', index)"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
><i class="el-icon-plus" />点击添加商品</el-button
|
||||
>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 商品样式 -->
|
||||
<el-form-item label="商品样式" class="lef" />
|
||||
<!-- 商品样式选择 -->
|
||||
<div class="moditystyle">
|
||||
<span
|
||||
v-for="(item, index) in moditystyles"
|
||||
:key="index"
|
||||
:class="item.type == datas.moditystyle ? 'active' : ''"
|
||||
@click="datas.moditystyle = index"
|
||||
>
|
||||
{{ item.text }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="bor" />
|
||||
|
||||
<!-- 显示位置 -->
|
||||
<el-form-item label="显示位置" class="lef">
|
||||
<div class="weiz">
|
||||
<i
|
||||
:class="datas.positions === 'left' ? 'active' : ''"
|
||||
class="iconfont icon-horizontal-left"
|
||||
@click="datas.positions = 'left'"
|
||||
/>
|
||||
<i
|
||||
:class="datas.positions === 'center' ? 'active' : ''"
|
||||
class="iconfont icon-juzhong"
|
||||
@click="datas.positions = 'center'"
|
||||
/>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 文本粗细 -->
|
||||
<el-form-item
|
||||
class="lef"
|
||||
label="文本粗细"
|
||||
prop="textWeight"
|
||||
:hide-required-asterisk="true"
|
||||
>
|
||||
<el-input
|
||||
type="number"
|
||||
v-model.number="datas.textWeight"
|
||||
placeholder="请输入文本粗细"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 图片倒角 -->
|
||||
<el-form-item label="图片倒角" class="lef borrediu">
|
||||
<el-slider
|
||||
v-model="datas.borderRadius"
|
||||
:max="30"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 页面边距 -->
|
||||
<el-form-item class="lef" label="页面边距">
|
||||
<el-slider
|
||||
v-model="datas.pageMargin"
|
||||
:max="20"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 商品间距 -->
|
||||
<el-form-item class="lef" label="商品间距">
|
||||
<el-slider
|
||||
v-model="datas.commodityMargin"
|
||||
:max="20"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<el-form-item class="lef" label="背景图片">
|
||||
<div class="shop-head-pic" style="text-align: center">
|
||||
<img class="home-bg" :src="datas.bgImg" alt="" v-if="datas.bgImg" />
|
||||
<div class="shop-head-pic-btn" style="text-align: center">
|
||||
<el-button
|
||||
@click="showUpload('0')"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
><i class="el-icon-plus" />更换图片</el-button
|
||||
>
|
||||
<el-button type="primary" class="uploadImg" @click="clear()">清空图片</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div style="height: 10px" />
|
||||
<!--商品价格 -->
|
||||
<el-form-item class="lef" label="商品价格">
|
||||
{{ datas.priceofcommodity ? '显示' : '隐藏' }}
|
||||
<el-checkbox
|
||||
style="margin-left: 196px"
|
||||
v-model="datas.priceofcommodity"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!--购买按钮 -->
|
||||
<el-form-item class="lef" label="购买按钮">
|
||||
{{ datas.purchasebutton ? '显示' : '隐藏' }}
|
||||
<el-checkbox
|
||||
style="margin-left: 196px"
|
||||
v-model="datas.purchasebutton"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-radio-group
|
||||
v-model="datas.purchasebuttonType"
|
||||
class="radi1"
|
||||
v-show="datas.purchasebutton"
|
||||
>
|
||||
<el-radio :label="index - 1" v-for="index in 8" :key="index"
|
||||
>样式{{ index }}</el-radio
|
||||
>
|
||||
|
||||
<el-input
|
||||
v-show="datas.purchasebuttonType > 3"
|
||||
style="width: 40%; margin-top: 10px"
|
||||
v-model="datas.purchase"
|
||||
size="mini"
|
||||
/>
|
||||
</el-radio-group>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!--商品角标 -->
|
||||
<el-form-item class="lef" label="商品角标">
|
||||
{{ datas.commoditycorner ? '显示' : '隐藏' }}
|
||||
<el-checkbox
|
||||
style="margin-left: 196px"
|
||||
v-model="datas.commoditycorner"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-radio-group
|
||||
v-model="datas.commoditycornertype"
|
||||
class="radi1"
|
||||
v-show="datas.commoditycorner"
|
||||
>
|
||||
<el-radio :label="index" v-for="(item, index) in marker" :key="index">{{
|
||||
item
|
||||
}}</el-radio>
|
||||
</el-radio-group>
|
||||
|
||||
<el-form-item class="lef" label="颜色">
|
||||
<el-color-picker
|
||||
v-model="datas.commodityTagColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="lef" label="位置">
|
||||
<el-radio-group v-model="datas.tagPosition" class="radi1">
|
||||
<el-radio
|
||||
:label="index"
|
||||
v-for="(item, index) in tagPosition"
|
||||
:key="index"
|
||||
>{{ item }}</el-radio
|
||||
>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传商品 -->
|
||||
<uploadCommodity
|
||||
ref="upload"
|
||||
@uploadListInformation="uploadListInformation"
|
||||
/>
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="uploadImg" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadCommodity from '../../uploadCommodity' //图片上传
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
import vuedraggable from 'vuedraggable' //拖拽组件
|
||||
|
||||
export default {
|
||||
name: 'listswitchingstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
components: { vuedraggable, uploadCommodity, uploadimg },
|
||||
data() {
|
||||
let kon = (rule, value, callback) => {
|
||||
if (value.length === 0) callback(new Error('请输入有效数字'))
|
||||
}
|
||||
return {
|
||||
color1: '#07c160',
|
||||
moditystyles: [
|
||||
/* 商品样式 */
|
||||
{
|
||||
text: '无边白底',
|
||||
type: 0,
|
||||
},
|
||||
{
|
||||
text: '卡片投影',
|
||||
type: 1,
|
||||
},
|
||||
{
|
||||
text: '描边白底',
|
||||
type: 2,
|
||||
},
|
||||
{
|
||||
text: '无边透明底',
|
||||
type: 3,
|
||||
},
|
||||
],
|
||||
commodityTypes: [
|
||||
{
|
||||
icon: 'icon-datumoshi',
|
||||
type: 0,
|
||||
content: '大图模式',
|
||||
},
|
||||
{
|
||||
icon: 'icon-commodity-yihangliangge',
|
||||
type: 1,
|
||||
content: '一行两个',
|
||||
},
|
||||
{
|
||||
icon: 'icon-yihangsange',
|
||||
type: 2,
|
||||
content: '一行三个',
|
||||
},
|
||||
{
|
||||
icon: 'icon-commodity-xiangxiliebiao',
|
||||
type: 3,
|
||||
content: '详细列表',
|
||||
},
|
||||
{
|
||||
icon: 'icon-icon_shangpintu_yidaliangxiao',
|
||||
type: 4,
|
||||
content: '一大两小',
|
||||
},
|
||||
{
|
||||
icon: 'icon-xuanzemokuai-daohanghengxianghuadong',
|
||||
type: 5,
|
||||
content: '横向滑动',
|
||||
},
|
||||
],
|
||||
rules: {
|
||||
textWeight: [{ required: true, validator: kon, trigger: 'blur' }],
|
||||
},
|
||||
marker: ['新品', '热卖', 'NEW', 'HOT'],
|
||||
dragOptions: {
|
||||
animation: 200,
|
||||
},
|
||||
imgText: null, //当前选中的类型
|
||||
imgNumber: null, //第几个数组
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
options: [], // 更多跳转链接
|
||||
moreName: null,
|
||||
tagPosition: [
|
||||
// 标记位置
|
||||
'左上',
|
||||
'左下',
|
||||
'右上',
|
||||
'右下',
|
||||
],
|
||||
uploadImgDataType: null,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// if(this.datas.moreUrl) {
|
||||
// this.moreName = this.datas.moreUrl[1]
|
||||
// }
|
||||
// this.changeImageListData()
|
||||
},
|
||||
methods: {
|
||||
changeImageListData() {
|
||||
let shopCommodity = JSON.parse(localStorage.getItem('shopCommodity'))
|
||||
console.log(shopCommodity, '--------------listswitching datas')
|
||||
// let newList = []
|
||||
// this.datas.imageList.forEach((element) => {
|
||||
// newList.push(shopCommodity[element.type][element.id])
|
||||
// })
|
||||
|
||||
// this.datas.imageList = newList
|
||||
},
|
||||
/* 上传图片弹框 */
|
||||
dialogVisibleshow(text, number) {
|
||||
this.$refs.upload.showUpload()
|
||||
this.imgText = text
|
||||
this.number = number
|
||||
},
|
||||
/* 添加分组 */
|
||||
addGrouping() {
|
||||
this.datas.commoditylisttypetab.push({
|
||||
text: '分组',
|
||||
imageList: [],
|
||||
})
|
||||
},
|
||||
// 提交
|
||||
uploadListInformation(res) {
|
||||
if (this.imgText === 'imageList') {
|
||||
this.datas.imageList.push(res)
|
||||
} else {
|
||||
this.datas.commoditylisttypetab[this.number].imageList.push(res)
|
||||
}
|
||||
|
||||
this.imgText = null
|
||||
this.number = null
|
||||
},
|
||||
|
||||
showUpload(type) {
|
||||
this.uploadImgDataType = type
|
||||
this.$refs.uploadImg.showUpload()
|
||||
},
|
||||
|
||||
// 背景图
|
||||
uploadInformation(res) {
|
||||
console.log(res, '---------uploadImg')
|
||||
if (this.uploadImgDataType === '0') {
|
||||
this.datas.bgImg = res
|
||||
console.log(this.datas.bgImg, '---------uploadImg')
|
||||
}
|
||||
},
|
||||
|
||||
// 清空背景图片
|
||||
clear() {
|
||||
this.datas.bgImg = ''
|
||||
},
|
||||
|
||||
/* 删除图片 */
|
||||
deleteimg(index) {
|
||||
this.datas.imageList.splice(index, 1)
|
||||
},
|
||||
|
||||
/* 删除分组里的图片 */
|
||||
delecommodityimg(ind, index) {
|
||||
this.datas.commoditylisttypetab[ind].imageList.splice(index, 1)
|
||||
},
|
||||
|
||||
/* 删除分组 */
|
||||
delecommoditylisttypetab(index) {
|
||||
this.datas.commoditylisttypetab.splice(index, 1)
|
||||
},
|
||||
|
||||
/* 获取下拉框内容 */
|
||||
getOption() {
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
})
|
||||
},
|
||||
|
||||
selectMore() {
|
||||
this.datas.showMore = true
|
||||
this.datas.moreUrl = this.moreName
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
styleText() {
|
||||
let modeType
|
||||
if (this.datas.commodityType === 0) return (modeType = '大图模式')
|
||||
if (this.datas.commodityType === 1) return (modeType = '一行两个')
|
||||
if (this.datas.commodityType === 2) return (modeType = '一行三个')
|
||||
if (this.datas.commodityType === 3) return (modeType = '详细列表')
|
||||
if (this.datas.commodityType === 4) return (modeType = '一大两小')
|
||||
if (this.datas.commodityType === 5) return (modeType = '横向滑动')
|
||||
|
||||
return modeType
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.listswitchingstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.shop-head-pic {
|
||||
color: #ababab;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.home-bg {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin: 10px auto;
|
||||
}
|
||||
.shop-head-pic-btn {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
.el-button {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
/* 列表样式 */
|
||||
.commodityType {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 58px;
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
background: #fff;
|
||||
border: 1px solid #ebedf0;
|
||||
color: #979797;
|
||||
margin: 0 1px;
|
||||
cursor: pointer;
|
||||
transition: all 0.5s;
|
||||
|
||||
&:hover {
|
||||
border: 1px solid #155bd4;
|
||||
color: #155bd4;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border: 1px solid #155bd4;
|
||||
background-color: #e0edff;
|
||||
color: #155bd4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 商品样式 */
|
||||
.moditystyle {
|
||||
font-size: 12px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
span {
|
||||
width: 86px;
|
||||
height: 32px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
cursor: pointer;
|
||||
border: 1px solid #ebedf0;
|
||||
&.active {
|
||||
border: 1px solid #155bd4;
|
||||
background-color: #e0edff;
|
||||
color: #155bd4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 位置 */
|
||||
.weiz {
|
||||
text-align: right;
|
||||
i {
|
||||
padding: 5px 14px;
|
||||
margin-left: 10px;
|
||||
border-radius: 0;
|
||||
border: 1px solid #ebedf0;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
|
||||
&:last-child {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #155bd4;
|
||||
border: 1px solid #155bd4;
|
||||
background: #e0edff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 单选框 */
|
||||
/deep/.radi1 {
|
||||
border-top: 1px solid #f7f8fa;
|
||||
border-bottom: 1px solid #f7f8fa;
|
||||
padding: 12px 0;
|
||||
.el-radio {
|
||||
margin: 10px 25px 7px 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* 商品列表 */
|
||||
.imgBanner {
|
||||
padding: 6px 12px;
|
||||
margin: 16px 7px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
/* 删除图标 */
|
||||
.el-icon-circle-close {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
.imag {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片字 */
|
||||
.imgText {
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
/* 上传图片按钮 */
|
||||
.uploadImg {
|
||||
width: 345px;
|
||||
height: 40px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
// 上传弹框内容部分
|
||||
/deep/.uploadIMG .el-dialog__body {
|
||||
height: 280px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.disable {
|
||||
/deep/.el-upload {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.tit {
|
||||
margin-bottom: 20px;
|
||||
/deep/.el-input__inner {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
410
src/components/rightslider/listswitchingstyle/productUpload.vue
Normal file
410
src/components/rightslider/listswitchingstyle/productUpload.vue
Normal file
@ -0,0 +1,410 @@
|
||||
<!-- 已被弃用 该组件为抽离的 魔方组件种商品上传 -->
|
||||
<template>
|
||||
<div class="productUpload">
|
||||
<!-- 分类名称 -->
|
||||
<!-- <section v-for="(item, index) in datas.commoditylisttypetab" :key="index">
|
||||
|
||||
<div class="bor" />
|
||||
|
||||
<el-input v-model="item.text" class="tit" style="width: 100px" placeholder="请输入分组名称" size="mini" />
|
||||
<i @click="delecommoditylisttypetab(index)" class="el-icon-delete" style="cursor: pointer;padding: 2px 4px;fnot-size: 12px;margin-left: 200px;color: red;" />
|
||||
|
||||
<vuedraggable v-model="item.imageList" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<section class="imgBanner" v-for="(item, ind) in item.imageList" :key="item+ind">
|
||||
<i class="el-icon-circle-close" @click="delecommodityimg(index, ind)" />
|
||||
<div class="imag">
|
||||
<img draggable="false" :src="item.coverUrl" alt="">
|
||||
</div>
|
||||
<div class="imgText">
|
||||
<div>
|
||||
<el-input disabled="disabled" style="width: 65%" v-model="item.name" size="mini" />
|
||||
<el-input disabled="disabled" type="number" style="width: 35%" v-model.number="item.price" size="mini" />
|
||||
</div>
|
||||
<el-input disabled="disabled" v-model="item.introduce" size="mini" />
|
||||
</div>
|
||||
</section>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
|
||||
<el-button @click="dialogVisibleshow('commoditylisttypetab', index)" class="uploadImg" type="primary" plain><i class="el-icon-plus" />点击添加商品</el-button>
|
||||
</section> -->
|
||||
<vuedraggable v-model="datas.commoditylisttypetab" v-bind="dragOptions">
|
||||
<section
|
||||
class="magiccubestyleList"
|
||||
v-for="(item, index) in datas.commoditylisttypetab"
|
||||
:key="index"
|
||||
>
|
||||
<div class="magiccubestyleList-top">
|
||||
<el-input
|
||||
v-model="item.text"
|
||||
class="tit"
|
||||
style="width: 100px"
|
||||
placeholder="请输入分组名称"
|
||||
size="mini"
|
||||
/>
|
||||
<i
|
||||
@click="delecommoditylisttypetab(index)"
|
||||
class="el-icon-delete"
|
||||
style="
|
||||
cursor: pointer;
|
||||
padding: 2px 4px;
|
||||
fnot-size: 12px;
|
||||
margin-left: 200px;
|
||||
color: red;
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 拖拽 -->
|
||||
<vuedraggable v-model="item.imageList" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<section
|
||||
class="imgBanner"
|
||||
v-for="(item, ind) in item.imageList"
|
||||
:key="item + ind"
|
||||
>
|
||||
<!-- 图片 -->
|
||||
<div class="imag" @click="$refs.upload.showUpload()">
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="!item.src"
|
||||
src="../../../assets/images/add.png"
|
||||
style="border: 1px solid #e5e5e5"
|
||||
alt=""
|
||||
/>
|
||||
<div v-else style="position: relative">
|
||||
<img draggable="false" :src="item.src" alt="" />
|
||||
<p
|
||||
style="
|
||||
width: 100%;
|
||||
background: #999;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
color: #fff;
|
||||
font-size: 5px;
|
||||
text-align: center;
|
||||
height: 20px;
|
||||
line-hright: 20px;
|
||||
"
|
||||
>
|
||||
点击跟换图片图片
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 删除 -->
|
||||
<i class="el-icon-circle-close" @click="deleteimg(index, ind)" />
|
||||
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgText">
|
||||
<div class="imgText-in">
|
||||
<el-input
|
||||
placeholder="请输入商品标题"
|
||||
v-model="item.name"
|
||||
size="mini"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 选择类型 -->
|
||||
<el-select
|
||||
v-model="item.httpType"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in optionsType"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.type"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
v-if="item.httpType !== '11'"
|
||||
v-model="item.http"
|
||||
placeholder="请选择图片跳转链接"
|
||||
size="mini"
|
||||
@change="changeId"
|
||||
@visible-change="changeType(item.httpType)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
v-if="item.httpType === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="item.externalLink"
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
</section>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
|
||||
<!-- 添加商品 -->
|
||||
<el-button
|
||||
@click="addproduct(index)"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
><i class="el-icon-plus" />点击添加商品</el-button
|
||||
>
|
||||
</section>
|
||||
</vuedraggable>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vuedraggable from 'vuedraggable' //拖拽组件
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dragOptions: {
|
||||
animation: 200,
|
||||
},
|
||||
imgActive: 0, //默认选中第一个图片
|
||||
options: [],
|
||||
optionsType: [
|
||||
{
|
||||
type: '1',
|
||||
name: '视频',
|
||||
},
|
||||
{
|
||||
type: '2',
|
||||
name: '书籍',
|
||||
},
|
||||
{
|
||||
type: '3',
|
||||
name: '音频',
|
||||
},
|
||||
{
|
||||
type: '6',
|
||||
name: '直播',
|
||||
},
|
||||
{
|
||||
type: '10',
|
||||
name: '跳转至历史页面',
|
||||
},
|
||||
{
|
||||
type: '11',
|
||||
name: '外部链接',
|
||||
},
|
||||
], //跳转类型
|
||||
}
|
||||
},
|
||||
|
||||
props: ['datas'],
|
||||
|
||||
created() {
|
||||
console.log(this.datas)
|
||||
},
|
||||
|
||||
methods: {
|
||||
/* 删除分组 */
|
||||
delecommoditylisttypetab(index) {
|
||||
this.datas.commoditylisttypetab.splice(index, 1)
|
||||
},
|
||||
|
||||
/* 删除分组里的图片 */
|
||||
delecommodityimg(ind, index) {
|
||||
this.datas.commoditylisttypetab[ind].imageList.splice(index, 1)
|
||||
},
|
||||
|
||||
/* 删除图片 */
|
||||
deleteimg(index, ind) {
|
||||
this.datas.commoditylisttypetab[index].imageList.splice(ind, 1)
|
||||
},
|
||||
|
||||
// 选择类型
|
||||
changeType(res) {
|
||||
console.log(res)
|
||||
if (res === '1' || res === '2' || res === '6' || res === '3') {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: res }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data
|
||||
})
|
||||
} else if (res === '10') {
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
})
|
||||
}
|
||||
},
|
||||
changeId(res) {
|
||||
if (res.component) delete res.component
|
||||
this.datas.imageList[this.imgActive].http = res
|
||||
},
|
||||
|
||||
/* 替换 */
|
||||
uploadInformation(res) {
|
||||
this.datas.imageList[this.imgActive].src = res
|
||||
},
|
||||
|
||||
// 添加商品
|
||||
addproduct(index) {
|
||||
let params = {
|
||||
httpType: '1', // 跳转类型
|
||||
coverUrl: null, // 商品图片
|
||||
id: null, // 跳转id
|
||||
externalLink: null, // 外链地址
|
||||
}
|
||||
this.datas.commoditylisttypetab[index].imageList.push(params)
|
||||
},
|
||||
},
|
||||
|
||||
components: { vuedraggable, uploadimg },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
/* 商品列表 */
|
||||
.magiccubestyleList {
|
||||
padding: 6px 12px;
|
||||
margin: 16px 0px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
.magiccubestyleList-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
/* 删除图标 */
|
||||
.el-icon-circle-close {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
.imag {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片字 */
|
||||
.imgText {
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
/* 商品列表 */
|
||||
.imgBanner {
|
||||
padding: 6px 12px;
|
||||
margin: 16px 7px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
/* 删除图标 */
|
||||
.el-icon-circle-close {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
.imag {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片字 */
|
||||
.imgText {
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
/* 上传图片按钮 */
|
||||
.uploadImg {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.tit {
|
||||
/deep/.el-input__inner {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
758
src/components/rightslider/magiccubestyle/index.vue
Normal file
758
src/components/rightslider/magiccubestyle/index.vue
Normal file
@ -0,0 +1,758 @@
|
||||
<template>
|
||||
<div class="magiccubestyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<p style="color: #d40000; font-size: 14px">魔方布局</p>
|
||||
<p style="color: #969799; font-size: 12px; margin: 5px 0">
|
||||
选定布局区域，在下方添加图片
|
||||
</p>
|
||||
|
||||
<!-- 图片布局 -->
|
||||
<!-- 一行二个 -->
|
||||
<section class="buju buju0" v-show="datas.rubiksCubeType === 0">
|
||||
<div
|
||||
@click="imgActive = index - 1"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
class="rubiksCubeType0 rubiksCubeType"
|
||||
:class="[index - 1 === imgActive ? 'active' : '']"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[index - 1].src">
|
||||
宽度375像素
|
||||
</div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
:src="datas.imageList[index - 1].src"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一行三个 -->
|
||||
<section class="buju buju0" v-show="datas.rubiksCubeType === 1">
|
||||
<div
|
||||
@click="imgActive = index - 1"
|
||||
v-for="index in 3"
|
||||
:key="index"
|
||||
class="rubiksCubeType1 rubiksCubeType"
|
||||
:class="[index - 1 === imgActive ? 'active' : '']"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[index - 1].src">
|
||||
宽度250像素
|
||||
</div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
:src="datas.imageList[index - 1].src"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一行四个 -->
|
||||
<section class="buju buju0" v-show="datas.rubiksCubeType === 2">
|
||||
<div
|
||||
@click="imgActive = index - 1"
|
||||
v-for="index in 4"
|
||||
:key="index"
|
||||
class="rubiksCubeType2 rubiksCubeType"
|
||||
:class="[index - 1 === imgActive ? 'active' : '']"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[index - 1].src">
|
||||
宽度188像素
|
||||
</div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
:src="datas.imageList[index - 1].src"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 二左二右 -->
|
||||
<section class="buju buju0" v-show="datas.rubiksCubeType === 3">
|
||||
<div
|
||||
@click="imgActive = index - 1"
|
||||
v-for="index in 4"
|
||||
:key="index"
|
||||
class="rubiksCubeType3 rubiksCubeType"
|
||||
:class="[index - 1 === imgActive ? 'active' : '']"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[index - 1].src">
|
||||
375x375像素<br />或同等比例
|
||||
</div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
:src="datas.imageList[index - 1].src"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一左二右 -->
|
||||
<section class="buju buju4" v-show="datas.rubiksCubeType === 4">
|
||||
<div
|
||||
@click="imgActive = 0"
|
||||
class="rubiksCubeType4 rubiksCubeType"
|
||||
style="width: 163px; height: 300px"
|
||||
:class="[0 === imgActive ? 'active' : '']"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[0].src">
|
||||
375x750像素<br />或同等比例
|
||||
</div>
|
||||
<img draggable="false" v-else :src="datas.imageList[0].src" alt="" />
|
||||
<div></div>
|
||||
</div>
|
||||
<div style="display: inline-flex; flex-direction: column">
|
||||
<div
|
||||
@click="imgActive = index"
|
||||
class="rubiksCubeType4 rubiksCubeType"
|
||||
:class="[index === imgActive ? 'active' : '']"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[index].src">
|
||||
375x375像素<br />或同等比例
|
||||
</div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
:src="datas.imageList[index].src"
|
||||
alt=""
|
||||
/>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一上二下 -->
|
||||
<section class="buju buju5" v-show="datas.rubiksCubeType === 5">
|
||||
<div
|
||||
@click="imgActive = 0"
|
||||
class="rubiksCubeType4 rubiksCubeType"
|
||||
style="width: 325px; height: 163px"
|
||||
:class="[0 === imgActive ? 'active' : '']"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[0].src">
|
||||
375x750像素<br />或同等比例
|
||||
</div>
|
||||
<img draggable="false" v-else :src="datas.imageList[0].src" alt="" />
|
||||
<div></div>
|
||||
</div>
|
||||
<div style="display: inline-flex">
|
||||
<div
|
||||
@click="imgActive = index"
|
||||
class="rubiksCubeType4 rubiksCubeType"
|
||||
:class="[index === imgActive ? 'active' : '']"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[index].src">
|
||||
375x375像素<br />或同等比例
|
||||
</div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
:src="datas.imageList[index].src"
|
||||
alt=""
|
||||
style="width: 163px; height: 163px"
|
||||
/>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一左三右 -->
|
||||
<section class="buju buju4" v-show="datas.rubiksCubeType === 6">
|
||||
<!-- 第一张图片 -->
|
||||
<div
|
||||
@click="imgActive = 0"
|
||||
class="rubiksCubeType4 rubiksCubeType"
|
||||
style="width: 163px; height: 325px"
|
||||
:class="[0 === imgActive ? 'active' : '']"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[0].src">
|
||||
375x750像素<br />或同等比例
|
||||
</div>
|
||||
<img draggable="false" v-else :src="datas.imageList[0].src" alt="" />
|
||||
</div>
|
||||
<div style="display: inline-flex; flex-direction: column">
|
||||
<!-- 第二张图片 -->
|
||||
<div
|
||||
@click="imgActive = 1"
|
||||
class="rubiksCubeType4 rubiksCubeType"
|
||||
:class="[1 === imgActive ? 'active' : '']"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[1].src">
|
||||
375x375像素<br />或同等比例
|
||||
</div>
|
||||
<img draggable="false" v-else :src="datas.imageList[1].src" alt="" />
|
||||
<div></div>
|
||||
</div>
|
||||
<div class="rubiksCubeType4 rubiksCubeType">
|
||||
<div
|
||||
@click="imgActive = index + 1"
|
||||
:class="[index + 1 === imgActive ? 'active' : '']"
|
||||
style="
|
||||
display: inline-flex;
|
||||
width: 82px;
|
||||
height: 163px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border: 1px solid #ebedf0;
|
||||
"
|
||||
v-for="index in 2"
|
||||
:key="index"
|
||||
>
|
||||
<div style="font-size: 12px" v-if="!datas.imageList[index + 1].src">
|
||||
188x375像素<br />或同等比例
|
||||
</div>
|
||||
<img
|
||||
draggable="false"
|
||||
v-else
|
||||
:src="datas.imageList[index + 1].src"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<p style="color: #d40000; font-size: 12px; margin-top: 10px">请添加图片</p>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="80px" :model="datas" size="small">
|
||||
<section
|
||||
class="magiccubestyleList"
|
||||
v-for="(item, index) in datas.imageList"
|
||||
:key="index"
|
||||
v-show="imgActive === index"
|
||||
>
|
||||
<!-- 图片 -->
|
||||
<div class="imag" @click="$refs.upload.showUpload()">
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="!item.src"
|
||||
src="../../../assets/images/add.png"
|
||||
style="border: 1px solid #e5e5e5"
|
||||
alt=""
|
||||
/>
|
||||
<div v-else style="position: relative">
|
||||
<img draggable="false" :src="item.src" alt="" />
|
||||
<p
|
||||
style="
|
||||
width: 100%;
|
||||
background: #999;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
color: #fff;
|
||||
font-size: 5px;
|
||||
text-align: center;
|
||||
height: 20px;
|
||||
line-hright: 20px;
|
||||
"
|
||||
>
|
||||
点击跟换图片图片
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgText">
|
||||
<!-- 选择类型 -->
|
||||
<el-select
|
||||
v-model="item.linktype"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
@change="selectType(index)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in optionsType"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.type"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
v-if="item.linktype !== '11'"
|
||||
v-model="item.http.name"
|
||||
placeholder="请选择图片跳转链接"
|
||||
size="mini"
|
||||
@change="changeId"
|
||||
:no-data-text="emptyText"
|
||||
@visible-change="
|
||||
(isVisible) => {
|
||||
return changeType(isVisible, item.linktype)
|
||||
}
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="[index, item]"
|
||||
:disabled="item.disabled"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
v-if="item.linktype === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="item.http.externalLink"
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div style="height: 20px" />
|
||||
|
||||
<!-- 标题内容 -->
|
||||
<el-form-item label="选择模板" class="lef">
|
||||
<p style="color: #000">{{ styleText }}</p>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 商品样式选择 -->
|
||||
<div class="rubiksCubeType">
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
:content="item.content"
|
||||
placement="bottom"
|
||||
v-for="(item, index) in rubiksCubeTypes"
|
||||
:key="index"
|
||||
>
|
||||
<span
|
||||
class="iconfont"
|
||||
style="font-size: 21px"
|
||||
:class="[
|
||||
item.linktype === datas.rubiksCubeType ? 'active' : '',
|
||||
item.icon,
|
||||
]"
|
||||
@click="datas.rubiksCubeType = index"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
||||
<div style="height: 20px" />
|
||||
|
||||
<!-- 页面边距 -->
|
||||
<el-form-item label="页面边距" class="lef">
|
||||
<el-slider
|
||||
v-model="datas.pageMargin"
|
||||
:max="20"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 图片间隙 -->
|
||||
<el-form-item label="图片间隙" class="lef">
|
||||
<el-slider
|
||||
v-model="datas.imgMargin"
|
||||
:max="20"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
|
||||
export default {
|
||||
name: 'magiccubestyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
components: { uploadimg },
|
||||
data() {
|
||||
return {
|
||||
rubiksCubeTypes: [
|
||||
{
|
||||
icon: 'icon-yihangerge',
|
||||
type: 0,
|
||||
content: '一行二个',
|
||||
},
|
||||
{
|
||||
icon: 'icon-yihangsange',
|
||||
type: 1,
|
||||
content: '一行三个',
|
||||
},
|
||||
{
|
||||
icon: 'icon-yihangsige',
|
||||
type: 2,
|
||||
content: '一行四个',
|
||||
},
|
||||
{
|
||||
icon: 'icon-erzuoeryou',
|
||||
type: 3,
|
||||
content: '二左二右',
|
||||
},
|
||||
{
|
||||
icon: 'icon-yizuoeryou',
|
||||
type: 4,
|
||||
content: '一左二右',
|
||||
},
|
||||
{
|
||||
icon: 'icon-yishangerxia',
|
||||
type: 5,
|
||||
content: '一上二下',
|
||||
},
|
||||
{
|
||||
icon: 'icon-yizuosanyou',
|
||||
type: 6,
|
||||
content: '一左三右',
|
||||
},
|
||||
],
|
||||
imgActive: 0, //默认选中第一个图片
|
||||
options: [], //选择
|
||||
optionsType: [
|
||||
{
|
||||
type: '1',
|
||||
name: '视频',
|
||||
},
|
||||
{
|
||||
type: '2',
|
||||
name: '书籍',
|
||||
},
|
||||
{
|
||||
type: '3',
|
||||
name: '音频',
|
||||
},
|
||||
{
|
||||
type: '6',
|
||||
name: '直播',
|
||||
},
|
||||
{
|
||||
type: '7',
|
||||
name: '实物商品',
|
||||
},
|
||||
{
|
||||
type: '10',
|
||||
name: '跳转至历史页面',
|
||||
},
|
||||
{
|
||||
type: '11',
|
||||
name: '外部链接',
|
||||
},
|
||||
], //跳转类型
|
||||
emptyText: '',
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// eslint-disable-next-line vue/return-in-computed-property
|
||||
styleText() {
|
||||
// eslint-disable-next-line vue/no-side-effects-in-computed-properties
|
||||
this.imgActive = 0
|
||||
if (this.datas.rubiksCubeType === 0) return '一行二个'
|
||||
if (this.datas.rubiksCubeType === 1) return '一行三个'
|
||||
if (this.datas.rubiksCubeType === 2) return '一行四个'
|
||||
if (this.datas.rubiksCubeType === 3) return '二左二右'
|
||||
if (this.datas.rubiksCubeType === 4) return '一左二右'
|
||||
if (this.datas.rubiksCubeType === 5) return '一上二下'
|
||||
if (this.datas.rubiksCubeType === 6) return '一左三右'
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.initImageList()
|
||||
},
|
||||
methods: {
|
||||
// 初始化更新imageList数据
|
||||
initImageList() {
|
||||
this.datas.imageList = this.$utils.replaceImageList(this.datas.imageList)
|
||||
console.log(this.datas.imageList, '------------created imageList')
|
||||
},
|
||||
|
||||
selectType() {
|
||||
// 清空 options
|
||||
this.options = []
|
||||
},
|
||||
|
||||
/* 替换 */
|
||||
uploadInformation(res) {
|
||||
this.datas.imageList[this.imgActive].src = res
|
||||
},
|
||||
/* 获取下拉框内容 */
|
||||
/* getOption() {
|
||||
this.$httpApi.shopTemplate().then( res => {
|
||||
if(res.code !== 0) return this.$message.error(res.msg);
|
||||
this.options = res.data.shopTemplateList
|
||||
})
|
||||
}, */
|
||||
changeId(res) {
|
||||
// 商品类型只匹配 1 2 3 6
|
||||
if (
|
||||
this.$utils.coursewareMetchArr.includes(
|
||||
this.datas.imageList[res[0]].linktype
|
||||
)
|
||||
) {
|
||||
// 查询本地动态数据 然后再赋值
|
||||
let dynamic = this.$utils.getCoursewareData(
|
||||
this.datas.imageList[res[0]].linktype,
|
||||
res[1].id
|
||||
)
|
||||
this.datas.imageList[res[0]].http = dynamic
|
||||
} else {
|
||||
this.datas.imageList[res[0]].http = res[1]
|
||||
}
|
||||
this.datas.imageList.forEach((item) => {
|
||||
if (item.http.component) {
|
||||
item.http.component = ''
|
||||
}
|
||||
})
|
||||
console.log(this.datas.imageList, '-----------------------save data')
|
||||
},
|
||||
|
||||
// 选择类型
|
||||
changeType(isVisible, linkType) {
|
||||
if (isVisible && linkType) {
|
||||
this.emptyText = '正在搜索中'
|
||||
if (
|
||||
linkType === '1' ||
|
||||
linkType === '2' ||
|
||||
linkType === '6' ||
|
||||
linkType === '3' ||
|
||||
linkType === '7'
|
||||
) {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: linkType }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
res.data.length === 0 ? (this.emptyText = '暂无数据') : null
|
||||
this.options = res.data
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
} else if (linkType === '10') {
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.magiccubestyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
/* 布局 */
|
||||
.buju {
|
||||
&.buju0 {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
&.buju4 {
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.active {
|
||||
background: #e0edff;
|
||||
border: 1px solid #155bd4;
|
||||
color: #155bd4;
|
||||
z-index: 2;
|
||||
}
|
||||
.rubiksCubeType {
|
||||
background-color: #fff;
|
||||
border: 1px solid #ebedf0;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #7d7e80;
|
||||
cursor: pointer;
|
||||
&.active {
|
||||
background: #e0edff;
|
||||
border: 1px solid #155bd4;
|
||||
color: #155bd4;
|
||||
z-index: 2;
|
||||
}
|
||||
&.rubiksCubeType0 {
|
||||
width: 163px;
|
||||
margin: 10px 0;
|
||||
// height: 200px;
|
||||
img {
|
||||
width: 100%;
|
||||
// height: 200px;
|
||||
}
|
||||
}
|
||||
&.rubiksCubeType1 {
|
||||
width: 109px;
|
||||
margin: 10px 0;
|
||||
height: 150px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
}
|
||||
}
|
||||
&.rubiksCubeType2 {
|
||||
width: 82px;
|
||||
margin: 10px 0;
|
||||
height: 150px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
}
|
||||
}
|
||||
&.rubiksCubeType3 {
|
||||
width: 163px;
|
||||
margin: 10px 0;
|
||||
height: 163px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
&.rubiksCubeType4 {
|
||||
width: 163px;
|
||||
height: 163px;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* 商品列表 */
|
||||
.magiccubestyleList {
|
||||
padding: 6px 12px;
|
||||
margin: 16px 0px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
/* 删除图标 */
|
||||
.el-icon-circle-close {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
.imag {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片字 */
|
||||
.imgText {
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
/* 列表样式 */
|
||||
.rubiksCubeType {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 58px;
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
background: #fff;
|
||||
border: 1px solid #ebedf0;
|
||||
color: #979797;
|
||||
margin: 0 1px;
|
||||
cursor: pointer;
|
||||
transition: all 0.5s;
|
||||
|
||||
&:hover {
|
||||
border: 1px solid #155bd4;
|
||||
color: #155bd4;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border: 1px solid #155bd4;
|
||||
background-color: #e0edff;
|
||||
color: #155bd4;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
122
src/components/rightslider/noticestyle/index.vue
Normal file
122
src/components/rightslider/noticestyle/index.vue
Normal file
@ -0,0 +1,122 @@
|
||||
<template>
|
||||
<div class="noticestyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 公告 -->
|
||||
<el-form
|
||||
label-width="90px"
|
||||
:model="datas"
|
||||
:rules="rules"
|
||||
size="small"
|
||||
class="lef"
|
||||
>
|
||||
<el-form-item
|
||||
label="公告"
|
||||
:hide-required-asterisk="true"
|
||||
prop="noticeText"
|
||||
>
|
||||
<el-input v-model="datas.noticeText" placeholder="请输入公告" />
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 背景颜色 -->
|
||||
<el-form-item label="背景颜色" class="lef">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.backColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 文字颜色 -->
|
||||
<el-form-item label="文字颜色" class="lef">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.textColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'noticestyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
rules: {
|
||||
//校验表单输入
|
||||
noticeText: [
|
||||
//页面名称
|
||||
{ required: true, message: '请输入公告', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.noticestyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* 颜色选择器 */
|
||||
.picke {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
35
src/components/rightslider/onlineservicestyle/index.vue
Normal file
35
src/components/rightslider/onlineservicestyle/index.vue
Normal file
@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<div class="onlineservicestyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'onlineservicestyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.onlineservicestyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<div class="personalizedrecommendationstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'personalizedrecommendationstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.personalizedrecommendationstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
604
src/components/rightslider/pictureadsstyle/index.vue
Normal file
604
src/components/rightslider/pictureadsstyle/index.vue
Normal file
@ -0,0 +1,604 @@
|
||||
<template>
|
||||
<div class="pictureadsstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>图片广告</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="80px" :model="datas" size="small">
|
||||
<!-- 标题内容 -->
|
||||
<el-form-item label="选择模板" class="lef">
|
||||
<p style="color: #000">{{ styleText }}</p>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 轮播图选择 -->
|
||||
<div class="swiperType">
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
content="一行一个"
|
||||
placement="bottom"
|
||||
>
|
||||
<span
|
||||
class="iconfont icon-yihangyige"
|
||||
style="font-size: 21px"
|
||||
:class="datas.swiperType === 0 ? 'active' : ''"
|
||||
@click="datas.swiperType = 0"
|
||||
/>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
content="轮播海报"
|
||||
placement="bottom"
|
||||
>
|
||||
<span
|
||||
class="iconfont icon-icon_tupian_lunbohaibao"
|
||||
style="font-size: 20px"
|
||||
:class="datas.swiperType === 1 ? 'active' : ''"
|
||||
@click="datas.swiperType = 1"
|
||||
/>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
content="多图单行"
|
||||
placement="bottom"
|
||||
>
|
||||
<span
|
||||
class="iconfont icon-daohanghengxianghuadong"
|
||||
style="font-size: 24px"
|
||||
:class="datas.swiperType === 2 ? 'active' : ''"
|
||||
@click="datas.swiperType = 2"
|
||||
/>
|
||||
</el-tooltip>
|
||||
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
content="立体轮播"
|
||||
placement="bottom"
|
||||
>
|
||||
<span
|
||||
class="iconfont icon-xiaotuhengxianghuadong"
|
||||
style="font-size: 24px"
|
||||
:class="datas.swiperType === 3 ? 'active' : ''"
|
||||
@click="datas.swiperType = 3"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
||||
<!-- 下划线 -->
|
||||
<div class="bor" />
|
||||
|
||||
<h5 style="color: #000; font-size: 14px">添加图片</h5>
|
||||
<p style="color: #969799; font-size: 12px; margin-top: 10px">
|
||||
拖动选中的导航可对其排序
|
||||
</p>
|
||||
|
||||
<!-- 图片广告 -->
|
||||
<div v-if="datas.imageList[0]">
|
||||
<vuedraggable v-model="datas.imageList" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<section
|
||||
class="imgBanner"
|
||||
v-for="(item, index) in datas.imageList"
|
||||
:key="item + index"
|
||||
>
|
||||
<i class="el-icon-circle-close" @click="deleteimg(index)" />
|
||||
<!-- 图片 -->
|
||||
<div class="imag">
|
||||
<img :src="item.src" alt draggable="false" />
|
||||
</div>
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgText">
|
||||
<el-input
|
||||
v-model="item.text"
|
||||
placeholder="请输入标题，也可不填"
|
||||
size="mini"
|
||||
></el-input>
|
||||
<!-- <el-select v-model="item.http.name" placeholder="请选择图片跳转链接" size="mini" @change="changeId" @visible-change="getOption">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="[index,item]">
|
||||
</el-option>
|
||||
</el-select>-->
|
||||
|
||||
<!-- 选择类型 -->
|
||||
<div class="select-type">
|
||||
<el-select
|
||||
style="width: 60%"
|
||||
v-model="item.linktype"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
@change="selectType(index)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in optionsType"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.type"
|
||||
></el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-model="item.http.name"
|
||||
v-if="item.linktype !== '11'"
|
||||
placeholder="请选择图片跳转链接"
|
||||
size="mini"
|
||||
:no-data-text="emptyText"
|
||||
@change="changeId"
|
||||
@visible-change="
|
||||
(isVisible) => {
|
||||
return changeType(isVisible, item.linktype)
|
||||
}
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="[index, item]"
|
||||
:disabled="item.disabled"
|
||||
></el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
style="width: 100%"
|
||||
v-if="item.linktype === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="item.http.externalLink"
|
||||
></el-input>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
</div>
|
||||
<!-- 上传图片 -->
|
||||
<el-button
|
||||
@click="$refs.upload.showUpload()"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
>
|
||||
<i class="el-icon-plus" />点击添加图片
|
||||
</el-button>
|
||||
|
||||
<!-- 下划线 -->
|
||||
<div class="bor"></div>
|
||||
|
||||
<el-form-item
|
||||
class="lef"
|
||||
label="一行个数"
|
||||
v-show="datas.swiperType === 2"
|
||||
>
|
||||
<!-- 单选框 -->
|
||||
<el-radio-group v-model="datas.rowindividual" class="radi">
|
||||
<el-radio :label="2">2个</el-radio>
|
||||
<el-radio :label="3">3个</el-radio>
|
||||
<el-radio :label="4">4个</el-radio>
|
||||
<el-radio :label="5">5个</el-radio>
|
||||
<el-radio :label="6">6个</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 图片倒角 -->
|
||||
<el-form-item label="分页类型" class="lef borrediu">
|
||||
<el-radio-group v-model="datas.pagingType" class="radi1">
|
||||
<el-radio :label="0">不显示</el-radio>
|
||||
<el-radio label="bullets">样式一</el-radio>
|
||||
<el-radio label="fraction">样式二</el-radio>
|
||||
<el-radio label="progressbar">样式三</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 图片倒角 -->
|
||||
<el-form-item label="图片倒角" class="lef borrediu">
|
||||
<el-slider
|
||||
v-model="datas.borderRadius"
|
||||
:max="30"
|
||||
input-size="mini"
|
||||
show-input
|
||||
></el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 页面边距 -->
|
||||
<el-form-item
|
||||
class="lef"
|
||||
label="页面边距"
|
||||
v-show="datas.swiperType === 0"
|
||||
>
|
||||
<el-slider
|
||||
v-model="datas.pageMargin"
|
||||
:max="20"
|
||||
input-size="mini"
|
||||
show-input
|
||||
></el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 图片边距 -->
|
||||
<el-form-item
|
||||
class="lef"
|
||||
label="图片边距"
|
||||
v-show="datas.swiperType === 0 || datas.swiperType === 2"
|
||||
>
|
||||
<el-slider
|
||||
v-model="datas.imageMargin"
|
||||
:max="20"
|
||||
input-size="mini"
|
||||
show-input
|
||||
></el-slider>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vuedraggable from 'vuedraggable' //拖拽组件
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
|
||||
export default {
|
||||
name: 'pictureadsstyle',
|
||||
components: { vuedraggable, uploadimg },
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
optionsType: [
|
||||
{
|
||||
type: '1',
|
||||
name: '视频',
|
||||
},
|
||||
{
|
||||
type: '2',
|
||||
name: '书籍',
|
||||
},
|
||||
{
|
||||
type: '3',
|
||||
name: '音频',
|
||||
},
|
||||
{
|
||||
type: '6',
|
||||
name: '直播',
|
||||
},
|
||||
{
|
||||
type: '7',
|
||||
name: '实物商品',
|
||||
},
|
||||
{
|
||||
type: '10',
|
||||
name: '跳转至历史页面',
|
||||
},
|
||||
{
|
||||
type: '11',
|
||||
name: '外部链接',
|
||||
},
|
||||
], // 选择跳转类型
|
||||
options: [], //选择
|
||||
dragOptions: {
|
||||
animation: 200,
|
||||
},
|
||||
emptyText: '',
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.initImageList()
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 初始化更新imageList数据
|
||||
initImageList() {
|
||||
this.datas.imageList = this.$utils.replaceImageList(this.datas.imageList)
|
||||
console.log(this.datas.imageList, '------------created imageList')
|
||||
},
|
||||
|
||||
// 提交
|
||||
uploadInformation(res) {
|
||||
this.datas.imageList.push({
|
||||
src: res,
|
||||
text: '',
|
||||
http: {},
|
||||
})
|
||||
},
|
||||
|
||||
/* 删除图片 */
|
||||
deleteimg(index) {
|
||||
this.datas.imageList.splice(index, 1)
|
||||
},
|
||||
|
||||
selectType(index) {
|
||||
// 每次切换类型之前 清空之前选中跳转
|
||||
this.datas.imageList[index].http = {}
|
||||
// 清空 options
|
||||
this.options = []
|
||||
},
|
||||
|
||||
// 选择类型
|
||||
changeType(isVisible, linkType) {
|
||||
if (isVisible && linkType) {
|
||||
this.emptyText = '正在搜索中'
|
||||
|
||||
if (
|
||||
linkType === '1' ||
|
||||
linkType === '2' ||
|
||||
linkType === '6' ||
|
||||
linkType === '3' ||
|
||||
linkType === '7'
|
||||
) {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: linkType }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
res.data.length === 0 ? (this.emptyText = '暂无数据') : null
|
||||
this.options = res.data
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
} else if (linkType === '10') {
|
||||
// 历史页面
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
changeId(res) {
|
||||
// 商品类型只匹配 1 2 3 6
|
||||
if (
|
||||
this.$utils.coursewareMetchArr.includes(
|
||||
this.datas.imageList[res[0]].linktype
|
||||
)
|
||||
) {
|
||||
// 查询本地动态数据 然后再赋值
|
||||
let dynamic = this.$utils.getCoursewareData(
|
||||
this.datas.imageList[res[0]].linktype,
|
||||
res[1].id
|
||||
)
|
||||
this.datas.imageList[res[0]].http = dynamic
|
||||
} else {
|
||||
this.datas.imageList[res[0]].http = res[1]
|
||||
}
|
||||
this.datas.imageList.forEach((item) => {
|
||||
if (item.http.component) {
|
||||
item.http.component = ''
|
||||
}
|
||||
})
|
||||
console.log(this.datas.imageList, '-----------------------save data')
|
||||
},
|
||||
},
|
||||
|
||||
computed: {
|
||||
styleText() {
|
||||
let data
|
||||
if (this.datas.swiperType === 0) return (data = '一行一个')
|
||||
if (this.datas.swiperType === 1) return (data = '轮播海报')
|
||||
if (this.datas.swiperType === 2) return (data = '多图单行')
|
||||
if (this.datas.swiperType === 3) return (data = '立体模式')
|
||||
if (this.datas.swiperType === 4) return (data = '导航横向滑动')
|
||||
|
||||
return data
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.pictureadsstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px;
|
||||
box-sizing: border-box;
|
||||
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* 轮播图样式 */
|
||||
.swiperType {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 58px;
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
background: #ebedf0;
|
||||
color: #979797;
|
||||
border: 1px solid #fff;
|
||||
cursor: pointer;
|
||||
transition: all 0.5s;
|
||||
|
||||
&:hover {
|
||||
border: 1px solid #155bd4;
|
||||
color: #155bd4;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border: 1px solid #155bd4;
|
||||
background-color: #e0edff;
|
||||
color: #155bd4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 圆角 */
|
||||
.borrediu {
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 48px;
|
||||
height: 26px;
|
||||
text-align: center;
|
||||
line-height: 26px;
|
||||
background: #ebedf0;
|
||||
color: #979797;
|
||||
border: 1px solid #fff;
|
||||
cursor: pointer;
|
||||
transition: all 0.5s;
|
||||
|
||||
&:hover {
|
||||
border: 1px solid #155bd4;
|
||||
color: #155bd4;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border: 1px solid #155bd4;
|
||||
background-color: #e0edff;
|
||||
color: #155bd4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.radi .el-radio {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
/deep/.radi1 .el-radio {
|
||||
margin-right: 7px;
|
||||
.el-radio__label {
|
||||
padding-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 上传图片按钮 */
|
||||
.uploadImg {
|
||||
width: 345px;
|
||||
height: 40px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
// 上传弹框内容部分
|
||||
/deep/.uploadIMG .el-dialog__body {
|
||||
height: 280px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.disable {
|
||||
/deep/.el-upload {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片广告列表 */
|
||||
.imgBanner {
|
||||
padding: 6px 12px;
|
||||
margin: 16px 7px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
/* 删除图标 */
|
||||
.el-icon-circle-close {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
.imag {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片字 */
|
||||
.imgText {
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
justify-content: space-between;
|
||||
.select-type {
|
||||
display: flex;
|
||||
/deep/.el-select {
|
||||
.el-input {
|
||||
input {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
199
src/components/rightslider/richtextstyle/index.vue
Normal file
199
src/components/rightslider/richtextstyle/index.vue
Normal file
@ -0,0 +1,199 @@
|
||||
<template>
|
||||
<div class="richtextstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<el-form label-width="80px" :model="datas" size="small">
|
||||
<!-- 背景颜色 -->
|
||||
<el-form-item label="背景颜色">
|
||||
<!-- 背景颜色 -->
|
||||
<el-color-picker
|
||||
v-model="datas.backColor"
|
||||
show-alpha
|
||||
style="float: right"
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div class="edit">
|
||||
<editor v-model="datas.myValue" :init="init" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Editor from '@tinymce/tinymce-vue'
|
||||
import 'tinymce/themes/silver'
|
||||
import 'tinymce/skins/ui/oxide/skin.min.css'
|
||||
import 'tinymce/plugins/image'
|
||||
import 'tinymce/plugins/lists'
|
||||
import 'tinymce/plugins/advlist'
|
||||
import 'tinymce/plugins/anchor'
|
||||
import 'tinymce/plugins/autosave'
|
||||
import 'tinymce/plugins/code'
|
||||
import 'tinymce/plugins/paste'
|
||||
import 'tinymce/plugins/directionality'
|
||||
import 'tinymce/plugins/link'
|
||||
import 'tinymce/plugins/fullscreen'
|
||||
import 'tinymce/plugins/hr'
|
||||
import 'tinymce/plugins/insertdatetime'
|
||||
import 'tinymce/plugins/pagebreak'
|
||||
import 'tinymce/plugins/preview'
|
||||
import 'tinymce/plugins/print'
|
||||
import 'tinymce/plugins/save'
|
||||
import 'tinymce/plugins/searchreplace'
|
||||
import 'tinymce/plugins/table'
|
||||
import 'tinymce/plugins/wordcount'
|
||||
import 'tinymce/plugins/toc'
|
||||
import 'tinymce/plugins/charmap'
|
||||
|
||||
export default {
|
||||
name: 'richtextstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
components: {
|
||||
Editor,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
init: {
|
||||
height: 550,
|
||||
language_url: '/langs/zh_CN.js',
|
||||
language: 'zh_CN',
|
||||
plugins: [
|
||||
'charmap',
|
||||
'toc',
|
||||
'wordcount',
|
||||
'table',
|
||||
'searchreplace',
|
||||
'image',
|
||||
'link',
|
||||
'lists',
|
||||
'advlist',
|
||||
'anchor',
|
||||
'autosave',
|
||||
'code',
|
||||
'paste',
|
||||
'directionality',
|
||||
'fullscreen',
|
||||
'hr',
|
||||
'insertdatetime',
|
||||
'pagebreak',
|
||||
'preview',
|
||||
'print',
|
||||
'save',
|
||||
],
|
||||
image_advtab: true,
|
||||
toolbar: [
|
||||
'fullscreen code bold italic underline strikethrough alignleft aligncenter alignright alignjustify \
|
||||
outdent indent image link removeformat cut copy paste ltr rtl anchor restoredraft pagebreak save \
|
||||
table tabledelete tableprops tablerowprops tablecellprops tableinsertrowbefore tableinsertrowafter tabledeleterow tableinsertcolbefore tableinsertcolafter tabledeletecol \
|
||||
backcolor formatselect fontselect fontsizeselect forecolor \
|
||||
subscript superscript hr preview print searchreplace wordcount toc charmap bullist numlist insertdatetime undo redo',
|
||||
],
|
||||
theme: 'silver', //主题
|
||||
menubar: false,
|
||||
images_upload_handler: (blobInfo, succFun, failFun) => {
|
||||
var formData = new FormData()
|
||||
|
||||
formData.append('path', 'test/')
|
||||
formData.append('file', blobInfo.blob(), blobInfo.blob().name)
|
||||
|
||||
var xhr = new XMLHttpRequest()
|
||||
xhr.withCredentials = false
|
||||
xhr.open('POST', `${window.global_config.BASE_URL}upload/miniShop`)
|
||||
|
||||
xhr.onload = function () {
|
||||
// 获取数据
|
||||
var res = JSON.parse(xhr.response)
|
||||
if (res.success != true) return failFun('HTTP Error: ' + res.msg)
|
||||
succFun(res.result)
|
||||
}
|
||||
xhr.send(formData)
|
||||
|
||||
// this.$httpApi.uploadImgs(formData).then(res => {
|
||||
// if(res.success != true) return failFun('HTTP Error: ' + res.msg)
|
||||
// succFun(res.result)
|
||||
// })
|
||||
},
|
||||
},
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.richtextstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
}
|
||||
|
||||
/* 修改富文本样式 */
|
||||
/deep/.tox {
|
||||
border: 1px solid #ebedf0 !important;
|
||||
}
|
||||
/deep/.tox .tox-tbtn {
|
||||
height: 25px !important;
|
||||
margin: 0 2px !important;
|
||||
width: auto;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
/deep/.tox .tox-tbtn--bespoke .tox-tbtn__select-label {
|
||||
width: auto !important;
|
||||
}
|
||||
/deep/.tox .tox-toolbar,
|
||||
.tox .tox-toolbar__primary,
|
||||
.tox .tox-toolbar__overflow {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
/deep/.tox .tox-toolbar__group {
|
||||
background: #f7f8fa;
|
||||
}
|
||||
|
||||
/deep/.tox .tox-tbtn--enabled,
|
||||
.tox .tox-tbtn--enabled:hover {
|
||||
background: none !important;
|
||||
/deep/svg {
|
||||
fill: #155bd4 !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
196
src/components/rightslider/storeinformationstyle/index.vue
Normal file
196
src/components/rightslider/storeinformationstyle/index.vue
Normal file
@ -0,0 +1,196 @@
|
||||
<template>
|
||||
<div class="storeinformationstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<p style="color: #323233; font-size: 14px">背景图片</p>
|
||||
<div style="height: 10px"></div>
|
||||
<p style="color: #969799; font-size: 12px">
|
||||
建议尺寸：750x370 像素，尺寸不匹配时，图片将被压缩或拉伸以铺满画面
|
||||
</p>
|
||||
|
||||
<div style="height: 10px"></div>
|
||||
<!-- 背景图 -->
|
||||
<div class="backgroundImg" @click="uploadI('bakcgroundImg')">
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="!datas.bakcgroundImg"
|
||||
src="../../../assets/images/backimg.png"
|
||||
alt=""
|
||||
/>
|
||||
<img draggable="false" v-else :src="datas.bakcgroundImg" alt="" />
|
||||
<p>更换图片</p>
|
||||
</div>
|
||||
|
||||
<div style="height: 20px"></div>
|
||||
<p style="color: #323233; font-size: 14px">店铺头像</p>
|
||||
|
||||
<div style="height: 10px"></div>
|
||||
<!-- 店铺头像 -->
|
||||
<div class="backgroundImg" @click="uploadI('headPortrait')">
|
||||
<img
|
||||
draggable="false"
|
||||
v-if="!datas.headPortrait"
|
||||
src="../../../assets/images/headerimg.png"
|
||||
alt=""
|
||||
/>
|
||||
<img draggable="false" v-else :src="datas.headPortrait" alt="" />
|
||||
<p>更换图片</p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
style="margin: 20px 0; height: 1px; background: rgb(235, 237, 240)"
|
||||
></div>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="80px" :model="datas" size="small" :rules="rules">
|
||||
<!-- 标题内容 -->
|
||||
<el-form-item label="选择模板" class="lef"> </el-form-item>
|
||||
|
||||
<!-- 商品样式选择 -->
|
||||
<el-radio-group v-model="datas.rubiksCubeType" class="select-sp">
|
||||
<el-radio
|
||||
style="margin-top: 10px; margin-right: 10px"
|
||||
:label="item.type"
|
||||
v-for="(item, index) in rubiksCubeTypes"
|
||||
:key="index"
|
||||
>{{ item.content }}</el-radio
|
||||
>
|
||||
</el-radio-group>
|
||||
|
||||
<div style="height: 30px"></div>
|
||||
|
||||
<!-- 店铺名称 -->
|
||||
<el-form-item label="店铺名称" class="lef" prop="name">
|
||||
<el-input
|
||||
v-model="datas.name"
|
||||
placeholder="请填写店铺名称"
|
||||
maxlength="20"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 店铺名称 -->
|
||||
<el-form-item label="优惠信息" class="lef">
|
||||
<el-input
|
||||
v-model="datas.Discount"
|
||||
placeholder="请填写优惠信息也可不填"
|
||||
maxlength="45"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
|
||||
export default {
|
||||
name: 'storeinformationstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
danqian: '', //当前选中的是背景还是头像
|
||||
rules: {
|
||||
name: [{ required: true, message: '请输入店铺名称', trigger: 'blur' }],
|
||||
},
|
||||
rubiksCubeTypes: [
|
||||
{
|
||||
type: 0,
|
||||
content: '样式一',
|
||||
},
|
||||
{
|
||||
type: 1,
|
||||
content: '样式二',
|
||||
},
|
||||
{
|
||||
type: 2,
|
||||
content: '样式三',
|
||||
},
|
||||
{
|
||||
type: 3,
|
||||
content: '样式四',
|
||||
},
|
||||
{
|
||||
type: 4,
|
||||
content: '样式五',
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/* 上传图片 */
|
||||
uploadI(res) {
|
||||
this.danqian = res
|
||||
this.$refs.upload.showUpload()
|
||||
},
|
||||
// 提交
|
||||
uploadInformation(res) {
|
||||
this.datas[this.danqian] = res
|
||||
},
|
||||
},
|
||||
components: { uploadimg },
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.storeinformationstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
/* 背景图 */
|
||||
.backgroundImg {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
position: relative;
|
||||
background: #f2f4f6;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
p {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
text-align: center;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
.select-sp {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
762
src/components/rightslider/storenotecardstyle/index.vue
Normal file
762
src/components/rightslider/storenotecardstyle/index.vue
Normal file
@ -0,0 +1,762 @@
|
||||
<template>
|
||||
<div class="storenotecardstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="80px" :model="datas" size="small" :rules="rules">
|
||||
<el-form-item label="活动名称" class="lef">
|
||||
<el-input v-model="datas.name"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<div class="bor" />
|
||||
|
||||
<!-- 标题内容 -->
|
||||
<el-form-item class="lef" label="选择模板">
|
||||
<p style="color: #000">{{ styleText }}</p>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 卡片样式选择 -->
|
||||
<div class="commodityType">
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
:content="item.content"
|
||||
placement="bottom"
|
||||
v-for="(item, index) in commodityTypes"
|
||||
:key="index"
|
||||
>
|
||||
<span
|
||||
class="iconfont"
|
||||
style="font-size: 21px"
|
||||
:class="[
|
||||
item.type === datas.commodityType ? 'active' : '',
|
||||
item.icon,
|
||||
]"
|
||||
@click="datas.commodityType = index"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
||||
<div class="bor" />
|
||||
|
||||
<h5 style="color: #000; font-size: 14px">添加卡片</h5>
|
||||
<p style="color: #969799; font-size: 12px; margin-top: 10px">
|
||||
鼠标拖拽调整卡片顺序
|
||||
</p>
|
||||
|
||||
<!-- 图片广告 -->
|
||||
<div v-if="datas.imageList[0]">
|
||||
<vuedraggable v-model="datas.imageList" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<section
|
||||
class="imgBanner"
|
||||
v-for="(item, index) in datas.imageList"
|
||||
:key="item + index"
|
||||
>
|
||||
<i class="el-icon-circle-close" @click="deleteimg(index)" />
|
||||
<!-- 图片 -->
|
||||
<div class="imag">
|
||||
<img :src="item.src" alt="" draggable="false" />
|
||||
</div>
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgText">
|
||||
<el-input
|
||||
v-model="item.text"
|
||||
placeholder="笔记标题"
|
||||
size="mini"
|
||||
/>
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgTextChild">
|
||||
<!-- 选择类型 -->
|
||||
<el-select
|
||||
v-model="item.linktype"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
@change="selectType(index)"
|
||||
>
|
||||
<el-option
|
||||
v-for="iteml in optionsType"
|
||||
:key="iteml.name"
|
||||
:label="iteml.name"
|
||||
:value="iteml.type"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
v-if="item.linktype !== '11'"
|
||||
v-model="item.http.name"
|
||||
placeholder="请选择图片跳转链接"
|
||||
size="mini"
|
||||
@change="changeId"
|
||||
:no-data-text="emptyText"
|
||||
@visible-change="
|
||||
(isVisible) => {
|
||||
return changeType(isVisible, item.linktype)
|
||||
}
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="[index, item]"
|
||||
:disabled="item.disabled"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
v-if="item.linktype === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="item.http.externalLink"
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
</div>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<el-button
|
||||
@click="$refs.upload.showUpload()"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
><i class="el-icon-plus" />点击添加卡片</el-button
|
||||
>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 卡片样式 -->
|
||||
<el-form-item label="卡片样式" class="lef" />
|
||||
<!-- 卡片样式选择 -->
|
||||
<div class="moditystyle">
|
||||
<span
|
||||
v-for="(item, index) in moditystyles"
|
||||
:key="index"
|
||||
:class="item.type == datas.moditystyle ? 'active' : ''"
|
||||
@click="datas.moditystyle = index"
|
||||
>
|
||||
{{ item.text }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="bor" />
|
||||
|
||||
<!-- 文本粗细 -->
|
||||
<el-form-item
|
||||
class="lef"
|
||||
label="文本粗细"
|
||||
prop="textWeight"
|
||||
:hide-required-asterisk="true"
|
||||
>
|
||||
<el-input
|
||||
type="number"
|
||||
v-model.number="datas.textWeight"
|
||||
placeholder="请输入文本粗细"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" />
|
||||
|
||||
<!-- 图片倒角 -->
|
||||
<el-form-item label="图片倒角" class="lef borrediu">
|
||||
<el-slider
|
||||
v-model="datas.borderRadius"
|
||||
:max="30"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<div style="height: 10px" v-if="datas.commodityType === 0" />
|
||||
|
||||
<!-- 显示位置 -->
|
||||
<el-form-item
|
||||
label="标题位置"
|
||||
class="lef"
|
||||
v-if="datas.commodityType === 0"
|
||||
>
|
||||
<div class="weiz">
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
content="上方"
|
||||
placement="bottom"
|
||||
>
|
||||
<i
|
||||
:class="datas.positions === 'top' ? 'active' : ''"
|
||||
class="iconfont icon-shang"
|
||||
@click="datas.positions = 'top'"
|
||||
/>
|
||||
</el-tooltip>
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
content="下方"
|
||||
placement="bottom"
|
||||
>
|
||||
<i
|
||||
:class="datas.positions === 'bottom' ? 'active' : ''"
|
||||
class="iconfont icon-jiantou"
|
||||
@click="datas.positions = 'bottom'"
|
||||
/>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<div class="bor" />
|
||||
|
||||
<!--笔记标签 -->
|
||||
<el-form-item class="lef" label="笔记标签">
|
||||
{{ datas.noteLabels ? '显示' : '隐藏' }}
|
||||
<el-checkbox style="margin-left: 196px" v-model="datas.noteLabels" />
|
||||
</el-form-item>
|
||||
|
||||
<!--阅读数 -->
|
||||
<el-form-item class="lef" label="阅读数">
|
||||
{{ datas.readingNumber ? '显示' : '隐藏' }}
|
||||
<el-checkbox style="margin-left: 196px" v-model="datas.readingNumber" />
|
||||
</el-form-item>
|
||||
|
||||
<!--点赞数 -->
|
||||
<el-form-item class="lef" label="点赞数">
|
||||
{{ datas.praisePoints ? '显示' : '隐藏' }}
|
||||
<el-checkbox style="margin-left: 196px" v-model="datas.praisePoints" />
|
||||
</el-form-item>
|
||||
|
||||
<!--查看更多 -->
|
||||
<el-form-item class="lef" label="查看更多">
|
||||
<!-- {{datas.viewMore1 ? '显示' : '隐藏'}} -->
|
||||
<el-checkbox v-model="datas.viewMore1"
|
||||
>头部{{ datas.viewMore1 ? '显示' : '隐藏' }}</el-checkbox
|
||||
>
|
||||
<el-checkbox v-model="datas.viewMore2"
|
||||
>尾部{{ datas.viewMore2 ? '显示' : '隐藏' }}</el-checkbox
|
||||
>
|
||||
<div class="imgText1" v-show="datas.viewMore1 || datas.viewMore2">
|
||||
<!-- 选择类型 -->
|
||||
<el-select
|
||||
style="width: 60%"
|
||||
v-model="datas.linktype"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in optionsType1"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.type"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-if="datas.linktype !== '11'"
|
||||
v-model="datas.http.name"
|
||||
placeholder="请选择图片跳转链接"
|
||||
size="mini"
|
||||
@change="changeId1"
|
||||
@visible-change="changeType1(datas.linktype)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options1"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
style="width: 100%"
|
||||
v-if="datas.linktype === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="datas.http.externalLink"
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vuedraggable from 'vuedraggable' //拖拽组件
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
|
||||
export default {
|
||||
name: 'storenotecardstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
components: { vuedraggable, uploadimg },
|
||||
data() {
|
||||
let kon = (rule, value, callback) => {
|
||||
if (value.length === 0) callback(new Error('请输入有效数字'))
|
||||
}
|
||||
return {
|
||||
optionsType1: [
|
||||
{
|
||||
type: '10',
|
||||
name: '跳转至历史页面',
|
||||
},
|
||||
{
|
||||
type: '11',
|
||||
name: '外部链接',
|
||||
},
|
||||
], // 选择跳转类型
|
||||
options1: [],
|
||||
moditystyles: [
|
||||
/* 卡片样式 */
|
||||
{
|
||||
text: '无边白底',
|
||||
type: 0,
|
||||
},
|
||||
{
|
||||
text: '卡片投影',
|
||||
type: 1,
|
||||
},
|
||||
{
|
||||
text: '描边白底',
|
||||
type: 2,
|
||||
},
|
||||
{
|
||||
text: '无边透明底',
|
||||
type: 3,
|
||||
},
|
||||
],
|
||||
commodityTypes: [
|
||||
{
|
||||
icon: 'icon-datumoshi',
|
||||
type: 0,
|
||||
content: '大图模式',
|
||||
},
|
||||
{
|
||||
icon: 'icon-commodity-yihangliangge',
|
||||
type: 1,
|
||||
content: '一行两个',
|
||||
},
|
||||
{
|
||||
icon: 'icon-xuanzemokuai-daohanghengxianghuadong',
|
||||
type: 2,
|
||||
content: '横向滑动',
|
||||
},
|
||||
{
|
||||
icon: 'icon-sanlan',
|
||||
type: 3,
|
||||
content: '一大两小',
|
||||
},
|
||||
{
|
||||
icon: 'icon-commodity-xiangxiliebiao',
|
||||
type: 4,
|
||||
content: '详细列表',
|
||||
},
|
||||
],
|
||||
rules: {
|
||||
textWeight: [{ required: true, validator: kon, trigger: 'blur' }],
|
||||
},
|
||||
marker: ['新品', '热卖', 'NEW', 'HOT'],
|
||||
dragOptions: {
|
||||
animation: 200,
|
||||
},
|
||||
optionsType: [
|
||||
{
|
||||
type: '1',
|
||||
name: '视频',
|
||||
},
|
||||
{
|
||||
type: '2',
|
||||
name: '书籍',
|
||||
},
|
||||
{
|
||||
type: '3',
|
||||
name: '音频',
|
||||
},
|
||||
{
|
||||
type: '6',
|
||||
name: '直播',
|
||||
},
|
||||
{
|
||||
type: '7',
|
||||
name: '实物商品',
|
||||
},
|
||||
{
|
||||
type: '10',
|
||||
name: '跳转至历史页面',
|
||||
},
|
||||
{
|
||||
type: '11',
|
||||
name: '外部链接',
|
||||
},
|
||||
], // 选择跳转类型
|
||||
options: [], //后端返回的列表提供下拉选择
|
||||
emptyText: '',
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initImageList()
|
||||
},
|
||||
methods: {
|
||||
// 初始化更新imageList数据
|
||||
initImageList() {
|
||||
this.datas.imageList = this.$utils.replaceImageList(this.datas.imageList)
|
||||
console.log(this.datas.imageList, '------------created imageList')
|
||||
},
|
||||
|
||||
selectType(index) {
|
||||
// 每次切换类型之前 清空之前选中跳转
|
||||
this.datas.imageList[index].http = {}
|
||||
// 清空 options
|
||||
this.options = []
|
||||
},
|
||||
// 提交
|
||||
uploadInformation(res) {
|
||||
this.datas.imageList.push({
|
||||
src: res,
|
||||
text: '这里显示笔记标题最多显示2行',
|
||||
http: {},
|
||||
type: '1',
|
||||
})
|
||||
},
|
||||
|
||||
/* 删除图片 */
|
||||
deleteimg(index) {
|
||||
this.datas.imageList.splice(index, 1)
|
||||
},
|
||||
// 选择类型
|
||||
changeType(isVisible, linkType) {
|
||||
if (isVisible && linkType) {
|
||||
this.emptyText = '正在搜索中'
|
||||
if (
|
||||
linkType === '1' ||
|
||||
linkType === '2' ||
|
||||
linkType === '6' ||
|
||||
linkType === '3' ||
|
||||
linkType === '7'
|
||||
) {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: linkType }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
res.data.length === 0 ? (this.emptyText = '暂无数据') : null
|
||||
this.options = res.data
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
} else if (linkType === '10') {
|
||||
// 历史页面
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
// 尾部查看更多
|
||||
changeType1(res) {
|
||||
if (res === '1' || res === '2' || res === '6' || res === '3') {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: res }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options1 = res.data
|
||||
})
|
||||
} else if (res === '10') {
|
||||
// 历史页面
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options1 = res.data.shopTemplateList
|
||||
})
|
||||
}
|
||||
},
|
||||
// 保存跳转的地方
|
||||
changeId1(res) {
|
||||
if (res.component) delete res.component
|
||||
this.datas.http = res
|
||||
},
|
||||
|
||||
changeId(res) {
|
||||
console.log(this.datas.imageList[res[0]].linktype, '-------------type')
|
||||
// 商品类型只匹配 1 2 3 6
|
||||
if (
|
||||
this.$utils.coursewareMetchArr.includes(
|
||||
this.datas.imageList[res[0]].linktype
|
||||
)
|
||||
) {
|
||||
// 查询本地动态数据 然后再赋值
|
||||
let dynamic = this.$utils.getCoursewareData(
|
||||
this.datas.imageList[res[0]].linktype,
|
||||
res[1].id
|
||||
)
|
||||
this.datas.imageList[res[0]].http = dynamic
|
||||
} else {
|
||||
this.datas.imageList[res[0]].http = res[1]
|
||||
}
|
||||
this.datas.imageList.forEach((item) => {
|
||||
if (item.http.component) {
|
||||
item.http.component = ''
|
||||
}
|
||||
})
|
||||
console.log(this.datas.imageList, '-----------------------save data')
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
// eslint-disable-next-line vue/return-in-computed-property
|
||||
styleText() {
|
||||
if (this.datas.commodityType === 0) return '大图模式'
|
||||
if (this.datas.commodityType === 1) return '一行两个'
|
||||
if (this.datas.commodityType === 2) return '横向滑动'
|
||||
if (this.datas.commodityType === 3) return '详细列表'
|
||||
if (this.datas.commodityType === 4) return '一大两小'
|
||||
if (this.datas.commodityType === 5) return '横向滑动'
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.storenotecardstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片字 */
|
||||
.imgText1 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
justify-content: space-between;
|
||||
.fir-sele.el-select {
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 列表样式 */
|
||||
.commodityType {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 58px;
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
background: #fff;
|
||||
border: 1px solid #ebedf0;
|
||||
color: #979797;
|
||||
margin: 0 1px;
|
||||
cursor: pointer;
|
||||
transition: all 0.5s;
|
||||
|
||||
&:hover {
|
||||
border: 1px solid #155bd4;
|
||||
color: #155bd4;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border: 1px solid #155bd4;
|
||||
background-color: #e0edff;
|
||||
color: #155bd4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 卡片样式 */
|
||||
.moditystyle {
|
||||
font-size: 12px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
span {
|
||||
width: 86px;
|
||||
height: 32px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
cursor: pointer;
|
||||
border: 1px solid #ebedf0;
|
||||
&.active {
|
||||
border: 1px solid #155bd4;
|
||||
background-color: #e0edff;
|
||||
color: #155bd4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 位置 */
|
||||
.weiz {
|
||||
text-align: right;
|
||||
i {
|
||||
padding: 5px 14px;
|
||||
margin-left: 10px;
|
||||
border-radius: 0;
|
||||
border: 1px solid #ebedf0;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
|
||||
&:last-child {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #155bd4;
|
||||
border: 1px solid #155bd4;
|
||||
background: #e0edff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 单选框 */
|
||||
/deep/.radi1 {
|
||||
border-top: 1px solid #f7f8fa;
|
||||
border-bottom: 1px solid #f7f8fa;
|
||||
padding: 12px 0;
|
||||
.el-radio {
|
||||
margin: 10px 25px 7px 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* 卡片列表 */
|
||||
.imgBanner {
|
||||
padding: 6px 12px;
|
||||
margin: 16px 7px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
/* 删除图标 */
|
||||
.el-icon-circle-close {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
.imag {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片字 */
|
||||
.imgText {
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
justify-content: space-between;
|
||||
/* 图片字 */
|
||||
.imgTextChild {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
justify-content: space-between;
|
||||
.fir-sele.el-select {
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 上传图片按钮 */
|
||||
.uploadImg {
|
||||
width: 345px;
|
||||
height: 40px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
// 上传弹框内容部分
|
||||
/deep/.uploadIMG .el-dialog__body {
|
||||
height: 280px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.disable {
|
||||
/deep/.el-upload {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.tit {
|
||||
/deep/.el-input__inner {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
168
src/components/rightslider/suspensionstyle/index.vue
Normal file
168
src/components/rightslider/suspensionstyle/index.vue
Normal file
@ -0,0 +1,168 @@
|
||||
<template>
|
||||
<div class="suspensionstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form
|
||||
label-position="top"
|
||||
label-width="80px"
|
||||
:model="datas"
|
||||
size="small"
|
||||
>
|
||||
<!-- 跳转页面 -->
|
||||
<el-form-item label="跳转页面">
|
||||
<div class="imgText">
|
||||
<!-- 选择类型 -->
|
||||
<el-select
|
||||
style="width: 60%"
|
||||
v-model="datas.type"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in optionsType"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.type"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-if="datas.type !== '11'"
|
||||
v-model="datas.http.name"
|
||||
placeholder="请选择跳转链接"
|
||||
size="mini"
|
||||
:no-data-text="emptyText"
|
||||
@change="changeId"
|
||||
@visible-change="
|
||||
(isVisible) => {
|
||||
return changeType(isVisible, datas.type)
|
||||
}
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
style="width: 100%"
|
||||
v-if="datas.type === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="datas.http.externalLink"
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'suspensionstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
optionsType: [
|
||||
{
|
||||
type: '10',
|
||||
name: '跳转至历史页面',
|
||||
},
|
||||
{
|
||||
type: '11',
|
||||
name: '外部链接',
|
||||
},
|
||||
], // 选择跳转类型
|
||||
options: [], //后端返回的列表提供下拉选择
|
||||
emptyText: '',
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
// 选择类型
|
||||
changeType(isVisible, linkType) {
|
||||
if (isVisible && linkType) {
|
||||
this.emptyText = '正在搜索中'
|
||||
if (
|
||||
linkType === '1' ||
|
||||
linkType === '2' ||
|
||||
linkType === '6' ||
|
||||
linkType === '3'
|
||||
) {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: linkType }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
res.data.length === 0 ? (this.emptyText = '暂无数据') : null
|
||||
this.options = res.data
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
} else if (linkType === '10') {
|
||||
// 历史页面
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
// 保存跳转的地方
|
||||
changeId(res) {
|
||||
console.log(res)
|
||||
if (res.component) delete res.component
|
||||
this.datas.http = res
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.suspensionstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
.imgText {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
justify-content: space-between;
|
||||
.fir-sele.el-select {
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
444
src/components/rightslider/tabBarStyle/index.vue
Normal file
444
src/components/rightslider/tabBarStyle/index.vue
Normal file
@ -0,0 +1,444 @@
|
||||
<template>
|
||||
<div class="investigatestyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
<el-form label-width="100px" :model="datas" size="small">
|
||||
<el-form-item class="lef" label="外边框">
|
||||
<el-checkbox v-model="datas.isShowBorder">显示</el-checkbox>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="lef" label="选中的颜色">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.activeColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="lef" label="未选中的颜色">
|
||||
<!-- 颜色选择器 -->
|
||||
<el-color-picker
|
||||
v-model="datas.inactiveColor"
|
||||
show-alpha
|
||||
class="picke"
|
||||
:predefine="predefineColors"
|
||||
>
|
||||
</el-color-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="lef" label="高亮位置">
|
||||
<el-slider
|
||||
v-model="datas.Highlight"
|
||||
:max="4"
|
||||
:min="0"
|
||||
input-size="mini"
|
||||
show-input
|
||||
>
|
||||
</el-slider>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="lef" label="导航"> </el-form-item>
|
||||
<vuedraggable v-model="datas.iconList" v-bind="dragOptions">
|
||||
<transition-group>
|
||||
<section
|
||||
class="imgBanner"
|
||||
v-for="(item, index) in datas.iconList"
|
||||
:key="item + index"
|
||||
>
|
||||
<i class="el-icon-circle-close" @click="deleteimg(index)" />
|
||||
<!-- 图片 -->
|
||||
<div class="imag">
|
||||
<img :src="item.iconPic" alt="" draggable="false" />
|
||||
</div>
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgText">
|
||||
<div class="imgText-top">
|
||||
<el-input
|
||||
v-model="item.iconText"
|
||||
placeholder="导航名称"
|
||||
size="mini"
|
||||
/>
|
||||
<div class="imgText-top-r">
|
||||
<span>小圆点</span>
|
||||
<el-checkbox v-model="item.isDot"></el-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 标题和链接 -->
|
||||
<div class="imgTextChild">
|
||||
<!-- 选择类型 -->
|
||||
<el-select
|
||||
v-model="item.linktype"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
@change="selectType(index)"
|
||||
>
|
||||
<el-option
|
||||
v-for="iteml in optionsType"
|
||||
:key="iteml.name"
|
||||
:label="iteml.name"
|
||||
:value="iteml.type"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
v-if="item.linktype !== '11'"
|
||||
v-model="item.http.name"
|
||||
placeholder="跳转地址"
|
||||
size="mini"
|
||||
@change="changeId"
|
||||
:no-data-text="emptyText"
|
||||
@visible-change="
|
||||
(isVisible) => {
|
||||
return changeType(isVisible, item.linktype)
|
||||
}
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="[index, item]"
|
||||
:disabled="item.disabled"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
v-if="item.linktype === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="item.http.externalLink"
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</transition-group>
|
||||
</vuedraggable>
|
||||
|
||||
<!-- 添加导航按钮 -->
|
||||
<el-button
|
||||
@click="$refs.upload.showUpload()"
|
||||
class="uploadImg"
|
||||
type="primary"
|
||||
plain
|
||||
v-if="datas.iconList.length < 5"
|
||||
>
|
||||
<i class="el-icon-plus" />点击添加导航
|
||||
</el-button>
|
||||
<i class="icon-tip">*最多添加5个</i>
|
||||
</el-form>
|
||||
|
||||
<!-- 上传图片 -->
|
||||
<uploadimg ref="upload" @uploadInformation="uploadInformation" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uploadimg from '../../uploadImg' //图片上传
|
||||
import vuedraggable from 'vuedraggable' //拖拽组件
|
||||
|
||||
export default {
|
||||
name: 'investigatestyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
predefineColors: [
|
||||
// 颜色选择器预设
|
||||
'#ff4500',
|
||||
'#ff8c00',
|
||||
'#ffd700',
|
||||
'#90ee90',
|
||||
'#00ced1',
|
||||
'#1e90ff',
|
||||
'#c71585',
|
||||
'#409EFF',
|
||||
'#909399',
|
||||
'#C0C4CC',
|
||||
'rgba(255, 69, 0, 0.68)',
|
||||
'rgb(255, 120, 0)',
|
||||
'hsv(51, 100, 98)',
|
||||
'hsva(120, 40, 94, 0.5)',
|
||||
'hsl(181, 100%, 37%)',
|
||||
'hsla(209, 100%, 56%, 0.73)',
|
||||
'#c7158577',
|
||||
],
|
||||
optionsType: [
|
||||
{
|
||||
type: '1',
|
||||
name: '视频',
|
||||
},
|
||||
{
|
||||
type: '2',
|
||||
name: '书籍',
|
||||
},
|
||||
{
|
||||
type: '3',
|
||||
name: '音频',
|
||||
},
|
||||
{
|
||||
type: '6',
|
||||
name: '直播',
|
||||
},
|
||||
{
|
||||
type: '7',
|
||||
name: '实物商品',
|
||||
},
|
||||
{
|
||||
type: '10',
|
||||
name: '跳转至历史页面',
|
||||
},
|
||||
{
|
||||
type: '11',
|
||||
name: '外部链接',
|
||||
},
|
||||
], // 选择跳转类型
|
||||
emptyText: '',
|
||||
options: [], //后端返回的列表提供下拉选择
|
||||
dragOptions: {
|
||||
animation: 200,
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
created() {},
|
||||
|
||||
mounted() {},
|
||||
|
||||
methods: {
|
||||
// 提交
|
||||
uploadInformation(res) {
|
||||
this.datas.iconList.push({
|
||||
/** 图标名称文字 */
|
||||
iconText: '',
|
||||
/** 图标图片 */
|
||||
iconPic: res,
|
||||
/** 是否显示小圆点 */
|
||||
isDot: false,
|
||||
/** 跳转类型 */
|
||||
linktype: '1',
|
||||
/** 跳转参数 */
|
||||
http: {},
|
||||
})
|
||||
},
|
||||
|
||||
/* 删除图片 */
|
||||
deleteimg(index) {
|
||||
this.datas.iconList.splice(index, 1)
|
||||
},
|
||||
|
||||
selectType(index) {
|
||||
// 每次切换类型之前 清空之前选中跳转
|
||||
this.datas.iconList[index].http = {}
|
||||
// 清空 options
|
||||
this.options = []
|
||||
},
|
||||
|
||||
// 选择类型
|
||||
changeType(isVisible, linkType) {
|
||||
if (isVisible && linkType) {
|
||||
this.emptyText = '正在搜索中'
|
||||
if (
|
||||
linkType === '1' ||
|
||||
linkType === '2' ||
|
||||
linkType === '6' ||
|
||||
linkType === '3' ||
|
||||
linkType === '7'
|
||||
) {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: linkType }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
res.data.length === 0 ? (this.emptyText = '暂无数据') : null
|
||||
this.options = res.data
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
} else if (linkType === '10') {
|
||||
// 历史页面
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
changeId(res) {
|
||||
console.log(this.datas.iconList[res[0]].linktype, '-------------type')
|
||||
// 商品类型只匹配 1 2 3 6
|
||||
if (
|
||||
this.$utils.coursewareMetchArr.includes(
|
||||
this.datas.iconList[res[0]].linktype
|
||||
)
|
||||
) {
|
||||
// 查询本地动态数据 然后再赋值
|
||||
let dynamic = this.$utils.getCoursewareData(
|
||||
this.datas.iconList[res[0]].linktype,
|
||||
res[1].id
|
||||
)
|
||||
this.datas.iconList[res[0]].http = dynamic
|
||||
} else {
|
||||
this.datas.iconList[res[0]].http = res[1]
|
||||
}
|
||||
this.datas.iconList.forEach((item) => {
|
||||
item.http.component = ''
|
||||
})
|
||||
console.log(this.datas.iconList, '-----------------------save data')
|
||||
},
|
||||
},
|
||||
|
||||
computed: {},
|
||||
|
||||
watch: {},
|
||||
|
||||
components: {
|
||||
uploadimg,
|
||||
vuedraggable,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.investigatestyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
/* 颜色选择器 */
|
||||
.picke {
|
||||
float: right;
|
||||
}
|
||||
|
||||
/* 上传图片按钮 */
|
||||
.uploadImg {
|
||||
width: 345px;
|
||||
height: 40px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* 卡片列表 */
|
||||
.imgBanner {
|
||||
padding: 6px 12px;
|
||||
margin: 16px 7px;
|
||||
border-radius: 2px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 4px 0 rgba(10, 42, 97, 0.2);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
/* 删除图标 */
|
||||
.el-icon-circle-close {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
cursor: pointer;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
.imag {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
/* 图片字 */
|
||||
.imgText {
|
||||
width: 80%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
padding-left: 20px;
|
||||
justify-content: space-between;
|
||||
/* 图片字 */
|
||||
.imgTextChild {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
justify-content: space-between;
|
||||
.fir-sele.el-select {
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
.imgText-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.imgText-top-r {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
span {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
/deep/.el-input,
|
||||
.el-input--mini {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.icon-tip {
|
||||
font-size: 12px;
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
136
src/components/rightslider/videostyle/index.vue
Normal file
136
src/components/rightslider/videostyle/index.vue
Normal file
@ -0,0 +1,136 @@
|
||||
<template>
|
||||
<div class="videostyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<el-form label-width="70px" :model="datas" size="small" class="lef">
|
||||
<el-form-item label="视频">
|
||||
<!-- 选择器 -->
|
||||
<el-select
|
||||
size="medium"
|
||||
v-model="videoData"
|
||||
placeholder="请选择需要播放的视频"
|
||||
@change="listChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in videoList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 刷新 -->
|
||||
<span class="link" @click="links">{{
|
||||
activ === 0 ? '刷新' : '刷新中...'
|
||||
}}</span>
|
||||
</el-form-item>
|
||||
<!-- 是否自动播放 -->
|
||||
<el-form-item class="lef" label="是否自动播放" label-width="100px">
|
||||
{{ datas.autoplay ? '是' : '否' }}
|
||||
<el-checkbox style="margin-left: 196px" v-model="datas.autoplay" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'videostyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
videoList: [], // 视频列表
|
||||
activ: 0, //刷新
|
||||
videoData: null,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.links()
|
||||
this.videoData = this.datas.videoData.name
|
||||
this.initImageList()
|
||||
},
|
||||
methods: {
|
||||
// 初始化更新imageList数据
|
||||
initImageList() {
|
||||
if (this.datas.videoData) {
|
||||
let shopCommodity = JSON.parse(localStorage.getItem('shopCommodity'))
|
||||
this.datas.videoData =
|
||||
shopCommodity[this.datas.videoData.type][this.datas.videoData.id]
|
||||
console.log(this.datas.videoData, '------------created imageList')
|
||||
}
|
||||
},
|
||||
|
||||
/* 加载视频下拉框 */
|
||||
links() {
|
||||
if (this.activ === 1) return
|
||||
this.activ = 1
|
||||
/* 获取视频信息 */
|
||||
this.$httpApi.newsList({ type: 1 }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.videoList = res.data
|
||||
})
|
||||
},
|
||||
|
||||
// 下拉框数据变化
|
||||
listChange(data) {
|
||||
let filterArr = this.videoList.filter((item) => {
|
||||
return item.name == data
|
||||
})
|
||||
|
||||
// 通过商品 type 和 id 获取到商品数据 newList接口数据可以不用
|
||||
this.datas.videoData = this.$utils.getCoursewareData('1', filterArr[0].id)
|
||||
console.log(this.datas.videoData, '------------------new video data')
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
datas: function () {
|
||||
this.videoData = this.datas.videoData.name
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.videostyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* 刷新 */
|
||||
.link {
|
||||
display: inline-block;
|
||||
padding: 0 10px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
color: #155bd4;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
137
src/components/rightslider/voicerstyle/index.vue
Normal file
137
src/components/rightslider/voicerstyle/index.vue
Normal file
@ -0,0 +1,137 @@
|
||||
<template>
|
||||
<div class="voicerstyle">
|
||||
<!-- 标题 -->
|
||||
<h2>{{ datas.text }}</h2>
|
||||
|
||||
<el-form label-width="70px" :model="datas" size="small" class="lef">
|
||||
<el-form-item label="音频">
|
||||
<!-- 选择器 -->
|
||||
<el-select
|
||||
size="medium"
|
||||
v-model="voicerData"
|
||||
placeholder="请选择需要播放的音频"
|
||||
@change="listChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in voicerList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 刷新 -->
|
||||
<span class="link" @click="links">{{
|
||||
activ === 0 ? '刷新' : '刷新中...'
|
||||
}}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'voicerstyle',
|
||||
props: {
|
||||
datas: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
voicerList: [], // 视频列表
|
||||
activ: 0, //刷新
|
||||
voicerData: null,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.links()
|
||||
this.voicerData = this.datas.voicerData.name
|
||||
this.initImageList()
|
||||
},
|
||||
methods: {
|
||||
// 初始化更新imageList数据
|
||||
initImageList() {
|
||||
if (this.datas.voicerData) {
|
||||
let shopCommodity = JSON.parse(localStorage.getItem('shopCommodity'))
|
||||
this.datas.voicerData =
|
||||
shopCommodity[this.datas.voicerData.type][this.datas.voicerData.id]
|
||||
console.log(this.datas.voicerData, '------------created imageList')
|
||||
}
|
||||
},
|
||||
|
||||
/* 加载视频下拉框 */
|
||||
links() {
|
||||
if (this.activ === 1) return
|
||||
this.activ = 1
|
||||
/* 获取视频信息 */
|
||||
this.$httpApi.newsList({ type: 3 }).then((res) => {
|
||||
this.activ = 0
|
||||
console.log(res.data)
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
|
||||
this.voicerList = res.data
|
||||
})
|
||||
},
|
||||
|
||||
// 下拉框数据变化
|
||||
listChange(data) {
|
||||
let filterArr = this.voicerList.filter((item) => {
|
||||
return item.name == data
|
||||
})
|
||||
|
||||
// 通过商品 type 和 id 获取到商品数据 newList接口数据可以不用
|
||||
this.datas.voicerData = this.$utils.getCoursewareData(
|
||||
'3',
|
||||
filterArr[0].id
|
||||
)
|
||||
console.log(this.datas.voicerData, '------------------new video data')
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
datas: function () {
|
||||
this.voicerData = this.datas.voicerData.name
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.voicerstyle {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
padding: 0 10px 20px;
|
||||
box-sizing: border-box;
|
||||
/* 标题 */
|
||||
h2 {
|
||||
padding: 24px 16px 24px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #f2f4f6;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #323233;
|
||||
}
|
||||
|
||||
.lef {
|
||||
/deep/.el-form-item__label {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* 刷新 */
|
||||
.link {
|
||||
display: inline-block;
|
||||
padding: 0 10px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
color: #155bd4;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
375
src/components/sliderassembly/index.vue
Normal file
375
src/components/sliderassembly/index.vue
Normal file
@ -0,0 +1,375 @@
|
||||
<template>
|
||||
<div class="sliderassembly">
|
||||
<el-collapse v-model="activeNames">
|
||||
<el-collapse-item
|
||||
:title="items.title"
|
||||
:name="index + 1"
|
||||
v-for="(items, index) in datas"
|
||||
:key="index"
|
||||
>
|
||||
<div
|
||||
class="componList"
|
||||
draggable="true"
|
||||
@dragstart="drag($event)"
|
||||
@dragend="dragends($event)"
|
||||
:data-name="item.name"
|
||||
v-for="(item, ind) in items.comList"
|
||||
:key="ind"
|
||||
>
|
||||
<i class="iconfont" :class="item.icon" />
|
||||
<p>{{ item.text }}</p>
|
||||
</div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'sliderassembly',
|
||||
props: {
|
||||
pointer: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeNames: [1, 2, 3] /* 侧边栏组件显示 */,
|
||||
datas: [
|
||||
{
|
||||
title: '基础组件',
|
||||
comList: [
|
||||
{
|
||||
text: '标题文本',
|
||||
type: '1-1',
|
||||
icon: 'icon-Component-biaotiwenzi',
|
||||
name: 'captiontext',
|
||||
},
|
||||
{
|
||||
text: '商品',
|
||||
type: '1-2',
|
||||
icon: 'icon-goods',
|
||||
name: 'listswitching',
|
||||
},
|
||||
{
|
||||
text: '图片广告',
|
||||
type: '1-3',
|
||||
icon: 'icon-tupianguanggao',
|
||||
name: 'pictureads',
|
||||
},
|
||||
{
|
||||
text: '图文导航',
|
||||
type: '1-4',
|
||||
icon: 'icon-icon_tupiandaohang',
|
||||
name: 'graphicnavigation',
|
||||
},
|
||||
{
|
||||
text: '富文本',
|
||||
type: '1-5',
|
||||
icon: 'icon-fuwenben',
|
||||
name: 'richtext',
|
||||
},
|
||||
{
|
||||
text: '魔方',
|
||||
type: '1-6',
|
||||
icon: 'icon-mofang',
|
||||
name: 'magiccube',
|
||||
},
|
||||
{
|
||||
text: '辅助分割',
|
||||
type: '1-7',
|
||||
icon: 'icon-Component-fuzhufenge',
|
||||
name: 'auxiliarysegmentation',
|
||||
},
|
||||
{
|
||||
text: '商品搜索',
|
||||
type: '1-8',
|
||||
icon: 'icon-shangpinsousuo',
|
||||
name: 'commoditysearch',
|
||||
},
|
||||
{
|
||||
text: '店铺信息',
|
||||
type: '1-9',
|
||||
icon: 'icon-dianpuxinxi',
|
||||
name: 'storeinformation',
|
||||
},
|
||||
{
|
||||
text: '进入店铺',
|
||||
type: '1-10',
|
||||
icon: 'icon-jinrudianpu',
|
||||
name: 'entertheshop',
|
||||
},
|
||||
{
|
||||
text: '公告',
|
||||
type: '1-11',
|
||||
icon: 'icon-gonggao',
|
||||
name: 'notice',
|
||||
},
|
||||
{
|
||||
text: '视频',
|
||||
type: '1-12',
|
||||
icon: 'icon-shipin',
|
||||
name: 'videoss',
|
||||
},
|
||||
{
|
||||
text: '音频',
|
||||
type: '1-13',
|
||||
icon: 'icon-yuyin',
|
||||
name: 'voicer',
|
||||
},
|
||||
|
||||
{
|
||||
text: '社群涨粉',
|
||||
type: '1-15',
|
||||
icon: 'icon-kuaisuzhangfen',
|
||||
name: 'communitypowder',
|
||||
},
|
||||
{
|
||||
text: '店铺笔记卡片',
|
||||
type: '1-16',
|
||||
icon: 'icon-dianpubijikapian',
|
||||
name: 'storenotecard',
|
||||
},
|
||||
/* {
|
||||
text: '人群运营',
|
||||
type: '1-17',
|
||||
icon: 'icon-yunying',
|
||||
name: ''
|
||||
}, */
|
||||
/* {
|
||||
text: '在线客服',
|
||||
type: '1-19',
|
||||
icon: 'icon-weibiaoti-_huaban',
|
||||
name: ''
|
||||
}, */
|
||||
/* {
|
||||
text: '个性化推荐',
|
||||
type: '1-18',
|
||||
icon: 'icon-gexinghuatuijian',
|
||||
name: ''
|
||||
}, */
|
||||
{
|
||||
text: '调研',
|
||||
type: '1-20',
|
||||
icon: 'icon-dianpubijikapian',
|
||||
name: 'investigate',
|
||||
},
|
||||
{
|
||||
text: '导航',
|
||||
type: '1-21',
|
||||
icon: 'icon-daohang',
|
||||
name: 'tabBar',
|
||||
},
|
||||
{
|
||||
text: '关注公众号',
|
||||
type: '1-22',
|
||||
icon: 'icon-gongzhonghao',
|
||||
name: 'follow',
|
||||
},
|
||||
{
|
||||
text: '悬浮',
|
||||
type: '1-23',
|
||||
icon: 'icon-wangye',
|
||||
name: 'suspension',
|
||||
},
|
||||
{
|
||||
text: '自定义模块',
|
||||
type: '1-13',
|
||||
icon: 'icon-zidingyimokuai',
|
||||
name: 'custommodule'
|
||||
},
|
||||
],
|
||||
},
|
||||
/* {
|
||||
title: '营销组件',
|
||||
comList: [
|
||||
{
|
||||
text: '优惠券',
|
||||
type: '2-1',
|
||||
icon: 'icon-youhuiquan',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '限时折扣',
|
||||
type: '2-2',
|
||||
icon: 'icon-xianshizhekou',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '秒杀',
|
||||
type: '2-3',
|
||||
icon: 'icon-miaosha',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '拼团',
|
||||
type: '2-4',
|
||||
icon: 'icon-pintuan-copy',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '砍价',
|
||||
type: '2-5',
|
||||
icon: 'icon-kanjia',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '周期购',
|
||||
type: '2-6',
|
||||
icon: 'icon-zhouqi',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '积分商城',
|
||||
type: '2-7',
|
||||
icon: 'icon-jifenzhang',
|
||||
name: ''
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '教育组件',
|
||||
comList: [
|
||||
{
|
||||
text: '课程',
|
||||
type: '3-1',
|
||||
icon: 'icon-kecheng',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '老师',
|
||||
type: '3-2',
|
||||
icon: 'icon-laoshi',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '知识专栏',
|
||||
type: '3-3',
|
||||
icon: 'icon-zhishizhuanlan1',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '知识内容',
|
||||
type: '3-4',
|
||||
icon: 'icon-zhishizhuanlan',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '知识直播',
|
||||
type: '3-5',
|
||||
icon: 'icon-zhibobofangshexiangjitianxianxianxing',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '知识付费会员',
|
||||
type: '3-6',
|
||||
icon: 'icon-zhishifufeihuiyuan',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '群打卡',
|
||||
type: '3-7',
|
||||
icon: 'icon-daka',
|
||||
name: ''
|
||||
},
|
||||
{
|
||||
text: '报名表单',
|
||||
type: '3-8',
|
||||
icon: 'icon-baomingbiaodan',
|
||||
name: ''
|
||||
}
|
||||
]
|
||||
} */
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 当用户开始拖动元素或选择文本时触发此事件
|
||||
*
|
||||
* @param {Object} event event对象
|
||||
*/
|
||||
drag(event) {
|
||||
/* 开启穿透 */
|
||||
this.pointer.show = true
|
||||
/* 传递参数 */
|
||||
event.dataTransfer.setData('componentName', event.target.dataset.name)
|
||||
},
|
||||
|
||||
/**
|
||||
* 当拖动操作结束时（释放鼠标按钮或按下退出键），会触发此事件
|
||||
*
|
||||
* @param {Object} event event对象
|
||||
*/
|
||||
dragends() {
|
||||
/* 关闭穿透 */
|
||||
this.pointer.show = false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
/* 组件 */
|
||||
.sliderassembly {
|
||||
width: 190px;
|
||||
height: 100%;
|
||||
overflow-y: scroll;
|
||||
border-right: 1px solid #ebedf0;
|
||||
box-sizing: border-box;
|
||||
padding: 0 12px;
|
||||
/* 滚动条 */
|
||||
&::-webkit-scrollbar {
|
||||
width: 1px;
|
||||
}
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: #155bd4;
|
||||
}
|
||||
/deep/.el-collapse-item__header,
|
||||
/deep/.el-collapse-item__wrap {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
|
||||
/* 组件列表 */
|
||||
.componList {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: 80px;
|
||||
height: 88px;
|
||||
margin-bottom: 8px;
|
||||
align-items: center;
|
||||
cursor: all-scroll;
|
||||
transition: all 0.3s;
|
||||
&:hover {
|
||||
background: #155bd4;
|
||||
border-radius: 2px;
|
||||
font-weight: 700;
|
||||
i,
|
||||
p,
|
||||
span {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
/* 图标 */
|
||||
i {
|
||||
font-size: 32px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
color: #b0a8a8;
|
||||
margin-top: 4px;
|
||||
}
|
||||
/* 标题 */
|
||||
p {
|
||||
font-size: 12px;
|
||||
color: #323233;
|
||||
margin-top: 4px;
|
||||
}
|
||||
/* 数量 */
|
||||
span {
|
||||
color: #7d7e80;
|
||||
margin-top: 4px;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
231
src/components/uploadCommodity/index.vue
Normal file
231
src/components/uploadCommodity/index.vue
Normal file
@ -0,0 +1,231 @@
|
||||
<template>
|
||||
<div class="uploadCommodity">
|
||||
<!-- 选择商品 -->
|
||||
<el-dialog
|
||||
class="uploadIMG"
|
||||
title="选择商品"
|
||||
:lock-scroll="true"
|
||||
:visible.sync="dialogVisible"
|
||||
:close-on-press-escape="false"
|
||||
:close-on-click-modal="false"
|
||||
:show-close="false"
|
||||
center
|
||||
width="500px"
|
||||
>
|
||||
<!-- 选择类型 -->
|
||||
<el-select
|
||||
style="width: 60%"
|
||||
v-model="type"
|
||||
placeholder="请选择跳转类型"
|
||||
size="mini"
|
||||
@change="selectType()"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in optionsType"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.type"
|
||||
></el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 选择 -->
|
||||
<el-select
|
||||
style="width: 60%; margin-top: 15px"
|
||||
v-if="type !== '11'"
|
||||
v-model="dialogImageUrl.name"
|
||||
placeholder="请选择图片跳转链接"
|
||||
size="mini"
|
||||
@change="changeId"
|
||||
:no-data-text="emptyText"
|
||||
@visible-change="
|
||||
(isVisible) => {
|
||||
return changeType(isVisible, type)
|
||||
}
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
:disabled="item.disabled"
|
||||
></el-option>
|
||||
</el-select>
|
||||
|
||||
<!-- 输入外部链接 -->
|
||||
<el-input
|
||||
style="width: 60%; margin-top: 15px"
|
||||
v-if="type === '11'"
|
||||
size="mini"
|
||||
placeholder="请输入链接，输入前确保可以访问"
|
||||
v-model="externalLink"
|
||||
></el-input>
|
||||
|
||||
<!-- 按钮 -->
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleClose">取 消 上 传</el-button>
|
||||
<el-button type="primary" @click="uploadInformation" :disabled="disabl"
|
||||
>点 击 上 传</el-button
|
||||
>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'uploadCommodity',
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false, //弹框默认隐藏
|
||||
dialogImageUrl: {}, // 选择的数据
|
||||
type: '1',
|
||||
uploadShow: false, //是否显示上传图片
|
||||
optionsType: [
|
||||
{
|
||||
type: '1',
|
||||
name: '视频',
|
||||
},
|
||||
{
|
||||
type: '3',
|
||||
name: '音频',
|
||||
},
|
||||
{
|
||||
type: '6',
|
||||
name: '直播',
|
||||
},
|
||||
{
|
||||
type: '7',
|
||||
name: '实物商品',
|
||||
},
|
||||
{
|
||||
type: '2',
|
||||
name: '书籍',
|
||||
},
|
||||
{
|
||||
type: '5',
|
||||
name: '其他',
|
||||
},
|
||||
// {
|
||||
// type: '10',
|
||||
// name: '跳转至历史页面'
|
||||
// },
|
||||
// {
|
||||
// type: '11',
|
||||
// name: '外部链接'
|
||||
// }
|
||||
], // 选择跳转类型
|
||||
options: [], //后端返回的列表提供下拉选择
|
||||
externalLink: null,
|
||||
emptyText: '',
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
selectType() {
|
||||
// 清空 options
|
||||
this.options = []
|
||||
},
|
||||
|
||||
// 选择类型
|
||||
changeType(isVisible, linkType) {
|
||||
if (isVisible && linkType) {
|
||||
this.emptyText = '正在搜索中'
|
||||
if (
|
||||
linkType === '1' ||
|
||||
linkType === '2' ||
|
||||
linkType === '6' ||
|
||||
linkType === '3' ||
|
||||
linkType === '7' ||
|
||||
linkType === '5'
|
||||
) {
|
||||
/* 获取视频,音频,直播信息 */
|
||||
this.$httpApi.newsList({ type: linkType }).then((res) => {
|
||||
this.activ = 0
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
res.data.length === 0 ? (this.emptyText = '暂无数据') : null
|
||||
this.options = res.data
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
} else if (linkType === '10') {
|
||||
// 历史页面
|
||||
this.$httpApi.shopTemplate().then((res) => {
|
||||
if (res.code !== 0) return this.$message.error(res.msg)
|
||||
this.options = res.data.shopTemplateList
|
||||
|
||||
// 校验数据
|
||||
this.options = this.$utils.filterCommodityData(
|
||||
linkType,
|
||||
this.options
|
||||
)
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
// 保存跳转的地方
|
||||
changeId(res) {
|
||||
console.log(res)
|
||||
// 通过商品 type 和 id 获取到商品数据 newList接口数据可以不用
|
||||
console.log(this.$utils.getCoursewareData(this.type, res.id))
|
||||
this.dialogImageUrl = this.$utils.getCoursewareData(this.type, res.id)
|
||||
},
|
||||
/* 显示上传文件组件 */
|
||||
showUpload() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
/* 传递图片地址 */
|
||||
uploadInformation() {
|
||||
this.dialogImageUrl.httpType = this.type
|
||||
this.$emit('uploadListInformation', this.dialogImageUrl)
|
||||
|
||||
// 隐藏上传弹框
|
||||
this.dialogVisible = false
|
||||
this.uploadShow = false
|
||||
this.dialogImageUrl = {}
|
||||
},
|
||||
// 关闭弹框
|
||||
handleClose() {
|
||||
this.$confirm('点击取消后您填写的信息将丢失，您确定取消？')
|
||||
.then(() => {
|
||||
// 隐藏上传文件
|
||||
this.dialogVisible = false
|
||||
this.dialogImageUrl = {}
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
// 提交按钮是否可以点击
|
||||
disabl() {
|
||||
if (!this.dialogImageUrl) return true
|
||||
else return false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import '../../assets/css/minx.less';
|
||||
.uploadCommodity {
|
||||
// 上传弹框内容部分
|
||||
/deep/.uploadIMG .el-dialog__body {
|
||||
height: 280px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.disable {
|
||||
/deep/.el-upload {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
161
src/components/uploadImg/index.vue
Normal file
161
src/components/uploadImg/index.vue
Normal file
@ -0,0 +1,161 @@
|
||||
<template>
|
||||
<div class="uploadImg">
|
||||
<!-- 上传图片 -->
|
||||
<el-dialog
|
||||
class="uploadIMG"
|
||||
title="上传图片"
|
||||
:lock-scroll="true"
|
||||
:visible.sync="dialogVisible"
|
||||
:close-on-press-escape="false"
|
||||
:close-on-click-modal="false"
|
||||
:show-close="false"
|
||||
center
|
||||
width="500px"
|
||||
>
|
||||
<!-- 上传图片 -->
|
||||
<el-upload
|
||||
v-if="dialogVisible"
|
||||
name="file"
|
||||
:action="baseupload"
|
||||
list-type="picture-card"
|
||||
:limit="1"
|
||||
:on-preview="preview"
|
||||
:on-success="onSuccess"
|
||||
:with-credentials="true"
|
||||
:on-error="uploadError"
|
||||
:before-upload="uploads"
|
||||
:before-remove="handleRemove"
|
||||
:class="uploadShow ? 'disable' : ''"
|
||||
>
|
||||
<i class="el-icon-plus"></i>
|
||||
</el-upload>
|
||||
|
||||
<!-- 按钮 -->
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleClose">取 消 上 传</el-button>
|
||||
<el-button type="primary" @click="uploadInformation" :disabled="disabl"
|
||||
>点 击 上 传</el-button
|
||||
>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 图片放大 -->
|
||||
<el-dialog :visible.sync="dialogVisibles" class="xianshi">
|
||||
<img
|
||||
draggable="false"
|
||||
style="width: 640px; height: 400px; margin: 20px 0px"
|
||||
:src="dialogImageUrl"
|
||||
alt=""
|
||||
/>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'uploadImg',
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false, //弹框默认隐藏
|
||||
dialogVisibles: false, // 放大的图片
|
||||
dialogImageUrl: '', // 上传的图片
|
||||
uploadShow: false, //是否显示上传图片
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
/* 显示上传文件组件 */
|
||||
showUpload() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
/* 传递图片地址 */
|
||||
uploadInformation() {
|
||||
this.$emit('uploadInformation', this.dialogImageUrl)
|
||||
// 隐藏上传弹框
|
||||
this.dialogVisible = false
|
||||
this.uploadShow = false
|
||||
this.dialogImageUrl = ''
|
||||
},
|
||||
// 关闭弹框
|
||||
handleClose() {
|
||||
this.$confirm('点击取消后您填写的信息将丢失，您确定取消？')
|
||||
.then(() => {
|
||||
this.handleRemove()
|
||||
// 隐藏上传文件
|
||||
this.dialogVisible = false
|
||||
this.dialogImageUrl = ''
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
|
||||
// 删除图片
|
||||
handleRemove() {
|
||||
this.uploadShow = false
|
||||
this.dialogImageUrl = ''
|
||||
return true
|
||||
},
|
||||
|
||||
// 预览
|
||||
preview() {
|
||||
this.dialogVisibles = true
|
||||
},
|
||||
|
||||
// 上传成功
|
||||
onSuccess(response) {
|
||||
// 返回错误
|
||||
if (response.success != true)
|
||||
return this.$message.error('上传图片失败，请删除后重新上传')
|
||||
|
||||
this.dialogImageUrl = response.data.src
|
||||
},
|
||||
|
||||
// 上传前
|
||||
uploads(file) {
|
||||
if (!file.type.includes('image')) {
|
||||
this.$message.error('请上传图片！')
|
||||
return false
|
||||
}
|
||||
this.uploadShow = true
|
||||
},
|
||||
|
||||
// 上传失败
|
||||
uploadError() {
|
||||
this.$message.error('请重新上传')
|
||||
this.uploadShow = false
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
// baseurl
|
||||
baseupload() {
|
||||
return `${window.global_config.BASE_URL}upload/miniShop`
|
||||
},
|
||||
|
||||
// 提交按钮是否可以点击
|
||||
disabl() {
|
||||
if (!this.dialogImageUrl) return true
|
||||
else return false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import '../../assets/css/minx.less';
|
||||
.uploadImg {
|
||||
// 上传弹框内容部分
|
||||
/deep/.uploadIMG .el-dialog__body {
|
||||
height: 280px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.disable {
|
||||
/deep/.el-upload {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user