This commit is contained in:
gboy 2024-03-22 15:48:25 +08:00
commit 76942b2a71
1156 changed files with 449417 additions and 0 deletions

14
.editorconfig Normal file
View File

@ -0,0 +1,14 @@
# https://editorconfig.org
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
[*.md]
insert_final_newline = false
trim_trailing_whitespace = false

20
.env.development Normal file
View File

@ -0,0 +1,20 @@
# just a flag
ENV = 'development'
# http://192.168.1.43:8324/admin
# http://mer.crmeb.net/admin
# base api
# VUE_APP_BASE_API = 'http://192.168.31.106:8324'
VUE_APP_BASE_API = 'https://mer1.crmeb.net'
# socket 连接地址
# VUE_APP_WS_URL = 'ws://0.0.0.0:8324'
VUE_APP_WS_URL = 'ws://mer1.crmeb.net'
# vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
# to control whether the babel-plugin-dynamic-import-node plugin is enabled.
# It only does one thing by converting all import() to require().
# This configuration can significantly increase the speed of hot updates,
# when you have a large number of pages.
# Detail: https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js
VUE_CLI_BABEL_TRANSPILE_MODULES = true

7
.env.production Normal file
View File

@ -0,0 +1,7 @@
# just a flag
ENV = 'production'
# base api
VUE_APP_BASE_API =
# socket 连接地址
VUE_APP_WS_URL =

8
.env.staging Normal file
View File

@ -0,0 +1,8 @@
NODE_ENV = production
# just a flag
ENV = 'staging'
# base api
VUE_APP_BASE_API = '/stage-api'

5
.eslintignore Normal file
View File

@ -0,0 +1,5 @@
build/*.js
src/assets
public
dist
src/

198
.eslintrc.js Normal file
View File

@ -0,0 +1,198 @@
module.exports = {
root: true,
parserOptions: {
parser: 'babel-eslint',
sourceType: 'module'
},
env: {
browser: true,
node: true,
es6: true,
},
extends: ['plugin:vue/recommended', 'eslint:recommended'],
// add your custom rules here
//it is base on https://github.com/vuejs/eslint-config-vue
rules: {
"vue/max-attributes-per-line": [2, {
"singleline": 10,
"multiline": {
"max": 1,
"allowFirstLine": false
}
}],
"vue/singleline-html-element-content-newline": "off",
"vue/multiline-html-element-content-newline":"off",
"vue/name-property-casing": ["error", "PascalCase"],
"vue/no-v-html": "off",
'accessor-pairs': 2,
'arrow-spacing': [2, {
'before': true,
'after': true
}],
'block-spacing': [2, 'always'],
'brace-style': [2, '1tbs', {
'allowSingleLine': true
}],
'camelcase': [0, {
'properties': 'always'
}],
'comma-dangle': [2, 'never'],
'comma-spacing': [2, {
'before': false,
'after': true
}],
'comma-style': [2, 'last'],
'constructor-super': 2,
'curly': [2, 'multi-line'],
'dot-location': [2, 'property'],
'eol-last': 2,
'eqeqeq': ["error", "always", {"null": "ignore"}],
'generator-star-spacing': [2, {
'before': true,
'after': true
}],
'handle-callback-err': [2, '^(err|error)$'],
'indent': [2, 2, {
'SwitchCase': 1
}],
'jsx-quotes': [2, 'prefer-single'],
'key-spacing': [2, {
'beforeColon': false,
'afterColon': true
}],
'keyword-spacing': [2, {
'before': true,
'after': true
}],
'new-cap': [2, {
'newIsCap': true,
'capIsNew': false
}],
'new-parens': 2,
'no-array-constructor': 2,
'no-caller': 2,
'no-console': 'off',
'no-class-assign': 2,
'no-cond-assign': 2,
'no-const-assign': 2,
'no-control-regex': 0,
'no-delete-var': 2,
'no-dupe-args': 2,
'no-dupe-class-members': 2,
'no-dupe-keys': 2,
'no-duplicate-case': 2,
'no-empty-character-class': 2,
'no-empty-pattern': 2,
'no-eval': 2,
'no-ex-assign': 2,
'no-extend-native': 2,
'no-extra-bind': 2,
'no-extra-boolean-cast': 2,
'no-extra-parens': [2, 'functions'],
'no-fallthrough': 2,
'no-floating-decimal': 2,
'no-func-assign': 2,
'no-implied-eval': 2,
'no-inner-declarations': [2, 'functions'],
'no-invalid-regexp': 2,
'no-irregular-whitespace': 2,
'no-iterator': 2,
'no-label-var': 2,
'no-labels': [2, {
'allowLoop': false,
'allowSwitch': false
}],
'no-lone-blocks': 2,
'no-mixed-spaces-and-tabs': 2,
'no-multi-spaces': 2,
'no-multi-str': 2,
'no-multiple-empty-lines': [2, {
'max': 1
}],
'no-native-reassign': 2,
'no-negated-in-lhs': 2,
'no-new-object': 2,
'no-new-require': 2,
'no-new-symbol': 2,
'no-new-wrappers': 2,
'no-obj-calls': 2,
'no-octal': 2,
'no-octal-escape': 2,
'no-path-concat': 2,
'no-proto': 2,
'no-redeclare': 2,
'no-regex-spaces': 2,
'no-return-assign': [2, 'except-parens'],
'no-self-assign': 2,
'no-self-compare': 2,
'no-sequences': 2,
'no-shadow-restricted-names': 2,
'no-spaced-func': 2,
'no-sparse-arrays': 2,
'no-this-before-super': 2,
'no-throw-literal': 2,
'no-trailing-spaces': 2,
'no-undef': 2,
'no-undef-init': 2,
'no-unexpected-multiline': 2,
'no-unmodified-loop-condition': 2,
'no-unneeded-ternary': [2, {
'defaultAssignment': false
}],
'no-unreachable': 2,
'no-unsafe-finally': 2,
'no-unused-vars': [2, {
'vars': 'all',
'args': 'none'
}],
'no-useless-call': 2,
'no-useless-computed-key': 2,
'no-useless-constructor': 2,
'no-useless-escape': 0,
'no-whitespace-before-property': 2,
'no-with': 2,
'one-var': [2, {
'initialized': 'never'
}],
'operator-linebreak': [2, 'after', {
'overrides': {
'?': 'before',
':': 'before'
}
}],
'padded-blocks': [2, 'never'],
'quotes': [2, 'single', {
'avoidEscape': true,
'allowTemplateLiterals': true
}],
'semi': [2, 'never'],
'semi-spacing': [2, {
'before': false,
'after': true
}],
'space-before-blocks': [2, 'always'],
'space-before-function-paren': [2, 'never'],
'space-in-parens': [2, 'never'],
'space-infix-ops': 2,
'space-unary-ops': [2, {
'words': true,
'nonwords': false
}],
'spaced-comment': [2, 'always', {
'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
}],
'template-curly-spacing': [2, 'never'],
'use-isnan': 2,
'valid-typeof': 2,
'wrap-iife': [2, 'any'],
'yield-star-spacing': [2, 'both'],
'yoda': [2, 'never'],
'prefer-const': 2,
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
'object-curly-spacing': [2, 'always', {
objectsInObjects: false
}],
'array-bracket-spacing': [2, 'never']
}
}

4
.github/FUNDING.yml vendored Normal file
View File

@ -0,0 +1,4 @@
# These are supported funding model platforms
patreon: panjiachen
custom: https://panjiachen.github.io/vue-element-admin-site/donate

33
.github/ISSUE_TEMPLATE/bug_report.md vendored Normal file
View File

@ -0,0 +1,33 @@
---
name: Bug report报告问题
about: Create a report to help us improve
---
<!--
注意:为更好的解决你的问题,请参考模板提供完整信息,准确描述问题,信息不全的 issue 将被关闭。
Note: In order to better solve your problem, please refer to the template to provide complete information, accurately describe the problem, and the incomplete information issue will be closed.
-->
## Bug report问题描述
#### Steps to reproduce问题复现步骤
<!--
1. [xxx]
2. [xxx]
3. [xxxx]
-->
#### Screenshot or Gif截图或动态图
#### Link to minimal reproduction最小可在线还原demo
<!--
Please only use Codepen, JSFiddle, CodeSandbox or a github repo
-->
#### Other relevant information格外信息
- Your OS:
- Node.js version:
- vue-element-admin version:

View File

@ -0,0 +1,7 @@
---
name: Feature Request新功能建议
about: Suggest an idea for this project
---
## Feature request新功能建议

35
.github/ISSUE_TEMPLATE/question.md vendored Normal file
View File

@ -0,0 +1,35 @@
---
name: Question提问
about: Asking questions about use
---
## Question提问
<!--
提问之前,请确定你已经过自己的努力,尝试解决过这个问题。
若是代码相关问题,请不要只截图,请提供在线 demo以便节约彼此的时间。
Before asking a question, please make sure that you have tried your best to solve this problem.
If it's a code-related issue, please don't just take screenshots. Please provide an online demo to save each other's time.
-->
#### Steps to reproduce问题复现步骤
<!--
1. [xxx]
2. [xxx]
3. [xxxx]
-->
#### Screenshot or Gif截图或动态图
#### Link to minimal reproduction最小可在线还原demo
<!--
Please only use Codepen, JSFiddle, CodeSandbox or a github repo
-->
#### Other relevant information格外信息
- Your OS:
- Node.js version:
- vue-element-admin version:

23
.gitignore vendored Normal file
View File

@ -0,0 +1,23 @@
.DS_Store
node_modules/
dist/
npm-debug.log*
yarn-debug.log*
yarn-error.log*
**/*.log
tests/**/coverage/
tests/e2e/reports
selenium-debug.log
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.local
package-lock.json
yarn.lock

5
.travis.yml Normal file
View File

@ -0,0 +1,5 @@
language: node_js
node_js: 10
script: npm run test
notifications:
email: false

21
LICENSE Normal file
View File

@ -0,0 +1,21 @@
MIT License
Copyright (c) 2017-present PanJiaChen
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

263
README.es.md Normal file
View File

@ -0,0 +1,263 @@
# CRMEB多商户
## 开发规范
统一使用ES6 语法
方法注释
/*
* th => 表头
* data => 数据
* fileName => 文件名
* fileType => 文件类型
* sheetName => sheet页名
*/
export default function toExcel ({ th, data, fileName, fileType, sheetName })
行注释 //
### 命名
页面目录 文件夹命名格式骆驼式命名法,例如:用户列表 userList
例如:商品模块
product 商品
├─ product 商品管理
├─productList 商品管理目录
├- index.vue 首页
页面命名、组建、文件夹 命名格式小驼峰命名法,例如:用户列表 userList
类名函数命名 大驼峰式 例如addUser
变量命名 小驼峰式 例如user 或者 userInfo _userinfo user-info
常量 采用全大些下划线命名 例如VUE_APP_API_URl
### 文件管理规范
pages 页面模块必须件文件夹区分
api 接口一个模块一个文件
组建 一个组建一个文件夹
plugins 插件一个插件一个文件夹
vuex 路由状态管理一个模块在modules 中建一个文件夹
router 一个模块一个模块在modules 中建一个文件夹
style 样式尽量采用iView自带组建common.less 系统通用样式不要轻易动
自定义通用样式 style.less,每次添加必须加注释页面独立样式在在页面内写后缀less 格式
组建样式 styles 中添加文件夹 composents 对应components 目录新建样式文件
utils 自定义工具js 独立命名,一般不用新建文件夹
## 模块命名
~~~
├─ login 登录
├─ dashboard 首页
├─ product 商品管理
├─ order 系统订单管理
├─ promoter 分销
├─ user 用户管理
├─ accounts 财务管理
├─ merchant 商户管理
├─ app 各个应用模块功能管理公众号、小程序、支付宝、百度小程序、今日头条小程序
├─ system 系统更新日志 数据库管理 素材管理
├─ setting 系统身份管理 系统权限管理、系统菜单管理、操作日志
├─ sms 短信设置
├─ systemForm 商城设置
├─ freight 物流设置
├─ maintain 安全维护
├─ safe 维护-页面链接
├─ userFeedback 用户反馈
├─ error-page 错误页
~~~
## 目录结构
主要目录结构及说明:
~~~
├── public # 静态资源
│ ├── favicon.ico # favicon图标
│ └── index.html # html 模板
├── src # 源代码
│ ├── api # 所有接口api
│ │ └──request.js # 请求封装
│ │ └──accounts.js # 有关财务的接口
│ │ └──promoter.js # 有关分销的接口
│ │ └──app.js # 有关应用(小程序、公众号)的接口
│ │ └──cms.js # 有关内容(文章管理、分类)的接口
│ │ └──home.js # 有关首页的接口
│ │ └──order.js # 有关订单的接口
│ │ └──product.js # 有关商品的接口
│ │ └──setting.js # 有关权限管理的接口
│ │ └──system.js # 有关系统配置的接口
│ │ └──systemForm.js # 有关表单组件的接口
│ │ └──maintain.js # 有关安全维护的接口
│ │ └──merchant.js # 有关商户的接口
│ │ └──sms.js # 有关短信设置的接口
│ │ └──user.js # 有关登录、用户的接口
│ │ └──userFeedback.js # 有关用户反馈的接口
│ │ └──freight.js # 有关物流设置的接口
│ ├── assets # 图片、svg 等静态资源
│ ├── icons # svg 等静态资源
│ ├── components # 公共组件
│ │ └──Breadcrumb # 头部标题标签
│ │ └──cards # 统计
│ │ └──echarts # 统计图
│ │ └──goodsList # 商品列表
│ │ └──Hamburger # 导航收缩组件
│ │ └──HeaderSearch # 导航搜索组件
│ │ └──iconFrom # 导航添加图标
│ │ └──newsCategory # 图文组件
│ │ └──RightPanel # 右侧设置按钮,设置导航相关
│ │ └──Screenfull # 全屏
│ │ └──SvgIcon # svg图标
│ │ └──ThemePicker # 右侧设置按钮,设置组题颜色
│ │ └──ueditorFrom # 富文本编辑器
│ │ └──uploadPicture # 上传图片组件
│ ├── layouts # 导航布局
│ │ ├──index # 主页面
│ │ ├──components # 导航组件
│ │ └──Settings # 右边小按钮,设置导航等
│ │ └──Sidebar # 侧边导航
│ │ └──TagsView # tab标签页导航
│ │ └──Navbar # 头部导航
│ │ └──AppMain # 导航路由
│ │ └──index.js # 组件引用
│ │ └──mixins # 自适应大小
│ ├── libs # 公共js方法
│ │ └──settingMer # 配置请求地址
│ ├── views # 所有页面
│ │ └──login # 登录
│ │ └──index # 登录
│ │ └──dashboard # 首页
│ │ └──product # 商品
│ │ └──band # 品牌管理
│ │ └──productClassify # 商品分类
│ │ └──productExamine # 商品审核
│ │ └──productComment # 商品评论管理
│ │ └──order # 订单管理
│ │ └──promoter # 分销
│ │ └──user # 分销员列表
│ │ └──config # 分销设置
│ │ └──cms # 内容
│ │ └──addArticle # 添加文章/编辑文章
│ │ └──article # 文章管理
│ │ └──articleCategory # 文章分类
│ │ └──user # 用户
│ │ └──group # 用户分组
│ │ └──group # 用户标签
│ │ └──list # 用户管理
│ │ └──accounts # 财务
│ │ └──bill # 充值记录
│ │ └──capital # 资金记录
│ │ └──extract # 提现管理
│ │ └──reconciliation # 财务对账
│ │ └──merchant # 商户
│ │ └──list # 商户列表
│ │ └──classify # 商户分类
│ │ └──system # 商户菜单管理
│ │ └──app # 应用
│ │ └──wechat # 公众号
│ │ └──menus # 微信菜单
│ │ └──newsCategory # 图文管理
│ │ └──save # 图文添加
│ │ └──reply # 自动回复
│ │ └──follow # 微信关注回复/无效关键词回复
│ │ └──keyword # 关键字回复
│ │ └──wxTemplate # 微信/小程序模板消息
│ │ └──system # 设置
│ │ └──config # 系统设置
│ │ └──classify # 配置分类
│ │ └──setting # 配置管理
│ │ └──picture # 素材管理
│ │ └──groupData # 组合设置
│ │ └──list # 组合数据
│ │ └──data # 组合数据列表/登录页幻灯片/首页幻灯片/首页导航按钮/首页推荐区/个人中心幻灯片/个人中心菜单/热门搜索/分销特权/分销海报/充值金额配置
│ │ └──setting # 设置-权限管理
│ │ └──systemRole # 身份管理
│ │ └──systemAdmin # 管理员管理
│ │ └──systemLog # 操作日志
│ │ └──systemMenu # 菜单管理
│ │ └──systemForm # 设置-商城设置
│ │ └──setSystem # 基础配置/商城配置/余额充值设置/文件上传/短信提醒开关/公众号支付配置/小程序支付配置/公众号配置/小程序配置
│ │ └──sms # 短信设置
│ │ └──smsConfig # 短信账户
│ │ └──smsTemplate # 短信模板
│ │ └──smsPay # 短信购买
│ │ └──freight # 物流设置
│ │ └──express # 物流公司
│ │ └──maintain # 安全维护
│ │ └──dataBackup # 数据备份
│ │ └──auth # 商业授权
│ │ └──safe # 维护-页面链接
│ │ └──pageLinks # 页面链接
│ │ └──userFeedback # 用户-用户反馈
│ │ └──list # 反馈列表
│ │ └──classify # 反馈分类
│ │ └──error-page # 错误页
│ │ └──404 # 错误页404
│ │ └──403 # 错误页403
│ ├── filters # 过滤器
│ ├── router # 路由配置
│ │ └──modules # 页面路由模块
│ │ └──accounts.js # 有关财务
│ │ └──app.js # 有关应用(公众号)
│ │ └──cms.js # 有关内容(文章管理、文章分类)
│ │ └──config.js # 有关系统配置
│ │ └──freight.js # 有关物流设置
│ │ └──group.js # 有关组合数据
│ │ └──maintain.js # 有关安全维护
│ │ └──merchant.js # 有关商户
│ │ └──order.js # 有关订单
│ │ └──product.js # 有关商品
│ │ └──promoter.js # 有关分销
│ │ └──routine.js # 有关小程序
│ │ └──safe.js # 有关维护
│ │ └──setting.js # 有关权限
│ │ └──sms.js # 有关短信
│ │ └──systemForm.js # 有关商城设置
│ │ └──user.js # 有关用户
│ │ └──feedback.js # 有关用户反馈
│ │ └──index.js # 路由的汇总
│ ├── store # Vuex 状态管理
│ ├── utils # 全局公用方法
│ ├── styles # 样式管理
│ ├── permission.js # 路由拦截
│ ├── setting.js # 业务配置文件
│ ├── main.js # 入口文件 加载组件 初始化等
│ └── App.vue # 入口页面
├── tests # 测试
├── .env.xxx # 环境变量配置
├── .eslintrc.js # eslint 配置项
├── .babelrc # babel-loader 配置
├── .travis.yml # 自动化CI配置
├── vue.config.js # vue-cli 配置
├── postcss.config.js # postcss 配置
└── package.json # package.json
~~~
## 开发打包项目
~~~
# 进入项目目录
$ cd admin-iView
# 安装依赖
$ npm install
# 启动项目(本地开发环境)
$ npm run dev
# 打包项目
## Build
```bash
# build for test environment
npm run build:stage
# build for production environment
npm run build:prod
```
## Advanced
```bash
# preview the release environment effect
npm run preview
# preview the release environment effect + static resource analysis
npm run preview -- --report
# code format check
npm run lint
# code format check and auto fix
npm run lint -- --fix
```

263
README.ja.md Normal file
View File

@ -0,0 +1,263 @@
# CRMEB多商户
## 开发规范
统一使用ES6 语法
方法注释
/*
* th => 表头
* data => 数据
* fileName => 文件名
* fileType => 文件类型
* sheetName => sheet页名
*/
export default function toExcel ({ th, data, fileName, fileType, sheetName })
行注释 //
### 命名
页面目录 文件夹命名格式骆驼式命名法,例如:用户列表 userList
例如:商品模块
product 商品
├─ product 商品管理
├─productList 商品管理目录
├- index.vue 首页
页面命名、组建、文件夹 命名格式小驼峰命名法,例如:用户列表 userList
类名函数命名 大驼峰式 例如addUser
变量命名 小驼峰式 例如user 或者 userInfo _userinfo user-info
常量 采用全大些下划线命名 例如VUE_APP_API_URl
### 文件管理规范
pages 页面模块必须件文件夹区分
api 接口一个模块一个文件
组建 一个组建一个文件夹
plugins 插件一个插件一个文件夹
vuex 路由状态管理一个模块在modules 中建一个文件夹
router 一个模块一个模块在modules 中建一个文件夹
style 样式尽量采用iView自带组建common.less 系统通用样式不要轻易动
自定义通用样式 style.less,每次添加必须加注释页面独立样式在在页面内写后缀less 格式
组建样式 styles 中添加文件夹 composents 对应components 目录新建样式文件
utils 自定义工具js 独立命名,一般不用新建文件夹
## 模块命名
~~~
├─ login 登录
├─ dashboard 首页
├─ product 商品管理
├─ order 系统订单管理
├─ promoter 分销
├─ user 用户管理
├─ accounts 财务管理
├─ merchant 商户管理
├─ app 各个应用模块功能管理公众号、小程序、支付宝、百度小程序、今日头条小程序
├─ system 系统更新日志 数据库管理 素材管理
├─ setting 系统身份管理 系统权限管理、系统菜单管理、操作日志
├─ sms 短信设置
├─ systemForm 商城设置
├─ freight 物流设置
├─ maintain 安全维护
├─ safe 维护-页面链接
├─ userFeedback 用户反馈
├─ error-page 错误页
~~~
## 目录结构
主要目录结构及说明:
~~~
├── public # 静态资源
│ ├── favicon.ico # favicon图标
│ └── index.html # html 模板
├── src # 源代码
│ ├── api # 所有接口api
│ │ └──request.js # 请求封装
│ │ └──accounts.js # 有关财务的接口
│ │ └──promoter.js # 有关分销的接口
│ │ └──app.js # 有关应用(小程序、公众号)的接口
│ │ └──cms.js # 有关内容(文章管理、分类)的接口
│ │ └──home.js # 有关首页的接口
│ │ └──order.js # 有关订单的接口
│ │ └──product.js # 有关商品的接口
│ │ └──setting.js # 有关权限管理的接口
│ │ └──system.js # 有关系统配置的接口
│ │ └──systemForm.js # 有关表单组件的接口
│ │ └──maintain.js # 有关安全维护的接口
│ │ └──merchant.js # 有关商户的接口
│ │ └──sms.js # 有关短信设置的接口
│ │ └──user.js # 有关登录、用户的接口
│ │ └──userFeedback.js # 有关用户反馈的接口
│ │ └──freight.js # 有关物流设置的接口
│ ├── assets # 图片、svg 等静态资源
│ ├── icons # svg 等静态资源
│ ├── components # 公共组件
│ │ └──Breadcrumb # 头部标题标签
│ │ └──cards # 统计
│ │ └──echarts # 统计图
│ │ └──goodsList # 商品列表
│ │ └──Hamburger # 导航收缩组件
│ │ └──HeaderSearch # 导航搜索组件
│ │ └──iconFrom # 导航添加图标
│ │ └──newsCategory # 图文组件
│ │ └──RightPanel # 右侧设置按钮,设置导航相关
│ │ └──Screenfull # 全屏
│ │ └──SvgIcon # svg图标
│ │ └──ThemePicker # 右侧设置按钮,设置组题颜色
│ │ └──ueditorFrom # 富文本编辑器
│ │ └──uploadPicture # 上传图片组件
│ ├── layouts # 导航布局
│ │ ├──index # 主页面
│ │ ├──components # 导航组件
│ │ └──Settings # 右边小按钮,设置导航等
│ │ └──Sidebar # 侧边导航
│ │ └──TagsView # tab标签页导航
│ │ └──Navbar # 头部导航
│ │ └──AppMain # 导航路由
│ │ └──index.js # 组件引用
│ │ └──mixins # 自适应大小
│ ├── libs # 公共js方法
│ │ └──settingMer # 配置请求地址
│ ├── views # 所有页面
│ │ └──login # 登录
│ │ └──index # 登录
│ │ └──dashboard # 首页
│ │ └──product # 商品
│ │ └──band # 品牌管理
│ │ └──productClassify # 商品分类
│ │ └──productExamine # 商品审核
│ │ └──productComment # 商品评论管理
│ │ └──order # 订单管理
│ │ └──promoter # 分销
│ │ └──user # 分销员列表
│ │ └──config # 分销设置
│ │ └──cms # 内容
│ │ └──addArticle # 添加文章/编辑文章
│ │ └──article # 文章管理
│ │ └──articleCategory # 文章分类
│ │ └──user # 用户
│ │ └──group # 用户分组
│ │ └──group # 用户标签
│ │ └──list # 用户管理
│ │ └──accounts # 财务
│ │ └──bill # 充值记录
│ │ └──capital # 资金记录
│ │ └──extract # 提现管理
│ │ └──reconciliation # 财务对账
│ │ └──merchant # 商户
│ │ └──list # 商户列表
│ │ └──classify # 商户分类
│ │ └──system # 商户菜单管理
│ │ └──app # 应用
│ │ └──wechat # 公众号
│ │ └──menus # 微信菜单
│ │ └──newsCategory # 图文管理
│ │ └──save # 图文添加
│ │ └──reply # 自动回复
│ │ └──follow # 微信关注回复/无效关键词回复
│ │ └──keyword # 关键字回复
│ │ └──wxTemplate # 微信/小程序模板消息
│ │ └──system # 设置
│ │ └──config # 系统设置
│ │ └──classify # 配置分类
│ │ └──setting # 配置管理
│ │ └──picture # 素材管理
│ │ └──groupData # 组合设置
│ │ └──list # 组合数据
│ │ └──data # 组合数据列表/登录页幻灯片/首页幻灯片/首页导航按钮/首页推荐区/个人中心幻灯片/个人中心菜单/热门搜索/分销特权/分销海报/充值金额配置
│ │ └──setting # 设置-权限管理
│ │ └──systemRole # 身份管理
│ │ └──systemAdmin # 管理员管理
│ │ └──systemLog # 操作日志
│ │ └──systemMenu # 菜单管理
│ │ └──systemForm # 设置-商城设置
│ │ └──setSystem # 基础配置/商城配置/余额充值设置/文件上传/短信提醒开关/公众号支付配置/小程序支付配置/公众号配置/小程序配置
│ │ └──sms # 短信设置
│ │ └──smsConfig # 短信账户
│ │ └──smsTemplate # 短信模板
│ │ └──smsPay # 短信购买
│ │ └──freight # 物流设置
│ │ └──express # 物流公司
│ │ └──maintain # 安全维护
│ │ └──dataBackup # 数据备份
│ │ └──auth # 商业授权
│ │ └──safe # 维护-页面链接
│ │ └──pageLinks # 页面链接
│ │ └──userFeedback # 用户-用户反馈
│ │ └──list # 反馈列表
│ │ └──classify # 反馈分类
│ │ └──error-page # 错误页
│ │ └──404 # 错误页404
│ │ └──403 # 错误页403
│ ├── filters # 过滤器
│ ├── router # 路由配置
│ │ └──modules # 页面路由模块
│ │ └──accounts.js # 有关财务
│ │ └──app.js # 有关应用(公众号)
│ │ └──cms.js # 有关内容(文章管理、文章分类)
│ │ └──config.js # 有关系统配置
│ │ └──freight.js # 有关物流设置
│ │ └──group.js # 有关组合数据
│ │ └──maintain.js # 有关安全维护
│ │ └──merchant.js # 有关商户
│ │ └──order.js # 有关订单
│ │ └──product.js # 有关商品
│ │ └──promoter.js # 有关分销
│ │ └──routine.js # 有关小程序
│ │ └──safe.js # 有关维护
│ │ └──setting.js # 有关权限
│ │ └──sms.js # 有关短信
│ │ └──systemForm.js # 有关商城设置
│ │ └──user.js # 有关用户
│ │ └──feedback.js # 有关用户反馈
│ │ └──index.js # 路由的汇总
│ ├── store # Vuex 状态管理
│ ├── utils # 全局公用方法
│ ├── styles # 样式管理
│ ├── permission.js # 路由拦截
│ ├── setting.js # 业务配置文件
│ ├── main.js # 入口文件 加载组件 初始化等
│ └── App.vue # 入口页面
├── tests # 测试
├── .env.xxx # 环境变量配置
├── .eslintrc.js # eslint 配置项
├── .babelrc # babel-loader 配置
├── .travis.yml # 自动化CI配置
├── vue.config.js # vue-cli 配置
├── postcss.config.js # postcss 配置
└── package.json # package.json
~~~
## 开发打包项目
~~~
# 进入项目目录
$ cd admin-iView
# 安装依赖
$ npm install
# 启动项目(本地开发环境)
$ npm run dev
# 打包项目
## Build
```bash
# build for test environment
npm run build:stage
# build for production environment
npm run build:prod
```
## Advanced
```bash
# preview the release environment effect
npm run preview
# preview the release environment effect + static resource analysis
npm run preview -- --report
# code format check
npm run lint
# code format check and auto fix
npm run lint -- --fix
```

263
README.md Normal file
View File

@ -0,0 +1,263 @@
# CRMEB多商户
## 开发规范
统一使用ES6 语法
方法注释
/*
* th => 表头
* data => 数据
* fileName => 文件名
* fileType => 文件类型
* sheetName => sheet页名
*/
export default function toExcel ({ th, data, fileName, fileType, sheetName })
行注释 //
### 命名
页面目录 文件夹命名格式骆驼式命名法,例如:用户列表 userList
例如:商品模块
product 商品
├─ product 商品管理
├─productList 商品管理目录
├- index.vue 首页
页面命名、组建、文件夹 命名格式小驼峰命名法,例如:用户列表 userList
类名函数命名 大驼峰式 例如addUser
变量命名 小驼峰式 例如user 或者 userInfo _userinfo user-info
常量 采用全大些下划线命名 例如VUE_APP_API_URl
### 文件管理规范
pages 页面模块必须件文件夹区分
api 接口一个模块一个文件
组建 一个组建一个文件夹
plugins 插件一个插件一个文件夹
vuex 路由状态管理一个模块在modules 中建一个文件夹
router 一个模块一个模块在modules 中建一个文件夹
style 样式尽量采用iView自带组建common.less 系统通用样式不要轻易动
自定义通用样式 style.less,每次添加必须加注释页面独立样式在在页面内写后缀less 格式
组建样式 styles 中添加文件夹 composents 对应components 目录新建样式文件
utils 自定义工具js 独立命名,一般不用新建文件夹
## 模块命名
~~~
├─ login 登录
├─ dashboard 首页
├─ product 商品管理
├─ order 系统订单管理
├─ promoter 分销
├─ user 用户管理
├─ accounts 财务管理
├─ merchant 商户管理
├─ app 各个应用模块功能管理公众号、小程序、支付宝、百度小程序、今日头条小程序
├─ system 系统更新日志 数据库管理 素材管理
├─ setting 系统身份管理 系统权限管理、系统菜单管理、操作日志
├─ sms 短信设置
├─ systemForm 商城设置
├─ freight 物流设置
├─ maintain 安全维护
├─ safe 维护-页面链接
├─ userFeedback 用户反馈
├─ error-page 错误页
~~~
## 目录结构
主要目录结构及说明:
~~~
├── public # 静态资源
│ ├── favicon.ico # favicon图标
│ └── index.html # html 模板
├── src # 源代码
│ ├── api # 所有接口api
│ │ └──request.js # 请求封装
│ │ └──accounts.js # 有关财务的接口
│ │ └──promoter.js # 有关分销的接口
│ │ └──app.js # 有关应用(小程序、公众号)的接口
│ │ └──cms.js # 有关内容(文章管理、分类)的接口
│ │ └──home.js # 有关首页的接口
│ │ └──order.js # 有关订单的接口
│ │ └──product.js # 有关商品的接口
│ │ └──setting.js # 有关权限管理的接口
│ │ └──system.js # 有关系统配置的接口
│ │ └──systemForm.js # 有关表单组件的接口
│ │ └──maintain.js # 有关安全维护的接口
│ │ └──merchant.js # 有关商户的接口
│ │ └──sms.js # 有关短信设置的接口
│ │ └──user.js # 有关登录、用户的接口
│ │ └──userFeedback.js # 有关用户反馈的接口
│ │ └──freight.js # 有关物流设置的接口
│ ├── assets # 图片、svg 等静态资源
│ ├── icons # svg 等静态资源
│ ├── components # 公共组件
│ │ └──Breadcrumb # 头部标题标签
│ │ └──cards # 统计
│ │ └──echarts # 统计图
│ │ └──goodsList # 商品列表
│ │ └──Hamburger # 导航收缩组件
│ │ └──HeaderSearch # 导航搜索组件
│ │ └──iconFrom # 导航添加图标
│ │ └──newsCategory # 图文组件
│ │ └──RightPanel # 右侧设置按钮,设置导航相关
│ │ └──Screenfull # 全屏
│ │ └──SvgIcon # svg图标
│ │ └──ThemePicker # 右侧设置按钮,设置组题颜色
│ │ └──ueditorFrom # 富文本编辑器
│ │ └──uploadPicture # 上传图片组件
│ ├── layouts # 导航布局
│ │ ├──index # 主页面
│ │ ├──components # 导航组件
│ │ └──Settings # 右边小按钮,设置导航等
│ │ └──Sidebar # 侧边导航
│ │ └──TagsView # tab标签页导航
│ │ └──Navbar # 头部导航
│ │ └──AppMain # 导航路由
│ │ └──index.js # 组件引用
│ │ └──mixins # 自适应大小
│ ├── libs # 公共js方法
│ │ └──settingMer # 配置请求地址
│ ├── views # 所有页面
│ │ └──login # 登录
│ │ └──index # 登录
│ │ └──dashboard # 首页
│ │ └──product # 商品
│ │ └──band # 品牌管理
│ │ └──productClassify # 商品分类
│ │ └──productExamine # 商品审核
│ │ └──productComment # 商品评论管理
│ │ └──order # 订单管理
│ │ └──promoter # 分销
│ │ └──user # 分销员列表
│ │ └──config # 分销设置
│ │ └──cms # 内容
│ │ └──addArticle # 添加文章/编辑文章
│ │ └──article # 文章管理
│ │ └──articleCategory # 文章分类
│ │ └──user # 用户
│ │ └──group # 用户分组
│ │ └──group # 用户标签
│ │ └──list # 用户管理
│ │ └──accounts # 财务
│ │ └──bill # 充值记录
│ │ └──capital # 资金记录
│ │ └──extract # 提现管理
│ │ └──reconciliation # 财务对账
│ │ └──merchant # 商户
│ │ └──list # 商户列表
│ │ └──classify # 商户分类
│ │ └──system # 商户菜单管理
│ │ └──app # 应用
│ │ └──wechat # 公众号
│ │ └──menus # 微信菜单
│ │ └──newsCategory # 图文管理
│ │ └──save # 图文添加
│ │ └──reply # 自动回复
│ │ └──follow # 微信关注回复/无效关键词回复
│ │ └──keyword # 关键字回复
│ │ └──wxTemplate # 微信/小程序模板消息
│ │ └──system # 设置
│ │ └──config # 系统设置
│ │ └──classify # 配置分类
│ │ └──setting # 配置管理
│ │ └──picture # 素材管理
│ │ └──groupData # 组合设置
│ │ └──list # 组合数据
│ │ └──data # 组合数据列表/登录页幻灯片/首页幻灯片/首页导航按钮/首页推荐区/个人中心幻灯片/个人中心菜单/热门搜索/分销特权/分销海报/充值金额配置
│ │ └──setting # 设置-权限管理
│ │ └──systemRole # 身份管理
│ │ └──systemAdmin # 管理员管理
│ │ └──systemLog # 操作日志
│ │ └──systemMenu # 菜单管理
│ │ └──systemForm # 设置-商城设置
│ │ └──setSystem # 基础配置/商城配置/余额充值设置/文件上传/短信提醒开关/公众号支付配置/小程序支付配置/公众号配置/小程序配置
│ │ └──sms # 短信设置
│ │ └──smsConfig # 短信账户
│ │ └──smsTemplate # 短信模板
│ │ └──smsPay # 短信购买
│ │ └──freight # 物流设置
│ │ └──express # 物流公司
│ │ └──maintain # 安全维护
│ │ └──dataBackup # 数据备份
│ │ └──auth # 商业授权
│ │ └──safe # 维护-页面链接
│ │ └──pageLinks # 页面链接
│ │ └──userFeedback # 用户-用户反馈
│ │ └──list # 反馈列表
│ │ └──classify # 反馈分类
│ │ └──error-page # 错误页
│ │ └──404 # 错误页404
│ │ └──403 # 错误页403
│ ├── filters # 过滤器
│ ├── router # 路由配置
│ │ └──modules # 页面路由模块
│ │ └──accounts.js # 有关财务
│ │ └──app.js # 有关应用(公众号)
│ │ └──cms.js # 有关内容(文章管理、文章分类)
│ │ └──config.js # 有关系统配置
│ │ └──freight.js # 有关物流设置
│ │ └──group.js # 有关组合数据
│ │ └──maintain.js # 有关安全维护
│ │ └──merchant.js # 有关商户
│ │ └──order.js # 有关订单
│ │ └──product.js # 有关商品
│ │ └──promoter.js # 有关分销
│ │ └──routine.js # 有关小程序
│ │ └──safe.js # 有关维护
│ │ └──setting.js # 有关权限
│ │ └──sms.js # 有关短信
│ │ └──systemForm.js # 有关商城设置
│ │ └──user.js # 有关用户
│ │ └──feedback.js # 有关用户反馈
│ │ └──index.js # 路由的汇总
│ ├── store # Vuex 状态管理
│ ├── utils # 全局公用方法
│ ├── styles # 样式管理
│ ├── permission.js # 路由拦截
│ ├── setting.js # 业务配置文件
│ ├── main.js # 入口文件 加载组件 初始化等
│ └── App.vue # 入口页面
├── tests # 测试
├── .env.xxx # 环境变量配置
├── .eslintrc.js # eslint 配置项
├── .babelrc # babel-loader 配置
├── .travis.yml # 自动化CI配置
├── vue.config.js # vue-cli 配置
├── postcss.config.js # postcss 配置
└── package.json # package.json
~~~
## 开发打包项目
~~~
# 进入项目目录
$ cd admin-iView
# 安装依赖
$ npm install
# 启动项目(本地开发环境)
$ npm run dev
# 打包项目
## Build
```bash
# build for test environment
npm run build:stage
# build for production environment
npm run build:prod
```
## Advanced
```bash
# preview the release environment effect
npm run preview
# preview the release environment effect + static resource analysis
npm run preview -- --report
# code format check
npm run lint
# code format check and auto fix
npm run lint -- --fix
```

263
README.zh-CN.md Normal file
View File

@ -0,0 +1,263 @@
# CRMEB多商户
## 开发规范
统一使用ES6 语法
方法注释
/*
* th => 表头
* data => 数据
* fileName => 文件名
* fileType => 文件类型
* sheetName => sheet页名
*/
export default function toExcel ({ th, data, fileName, fileType, sheetName })
行注释 //
### 命名
页面目录 文件夹命名格式骆驼式命名法,例如:用户列表 userList
例如:商品模块
product 商品
├─ product 商品管理
├─productList 商品管理目录
├- index.vue 首页
页面命名、组建、文件夹 命名格式小驼峰命名法,例如:用户列表 userList
类名函数命名 大驼峰式 例如addUser
变量命名 小驼峰式 例如user 或者 userInfo _userinfo user-info
常量 采用全大些下划线命名 例如VUE_APP_API_URl
### 文件管理规范
pages 页面模块必须件文件夹区分
api 接口一个模块一个文件
组建 一个组建一个文件夹
plugins 插件一个插件一个文件夹
vuex 路由状态管理一个模块在modules 中建一个文件夹
router 一个模块一个模块在modules 中建一个文件夹
style 样式尽量采用iView自带组建common.less 系统通用样式不要轻易动
自定义通用样式 style.less,每次添加必须加注释页面独立样式在在页面内写后缀less 格式
组建样式 styles 中添加文件夹 composents 对应components 目录新建样式文件
utils 自定义工具js 独立命名,一般不用新建文件夹
## 模块命名
~~~
├─ login 登录
├─ dashboard 首页
├─ product 商品管理
├─ order 系统订单管理
├─ promoter 分销
├─ user 用户管理
├─ accounts 财务管理
├─ merchant 商户管理
├─ app 各个应用模块功能管理公众号、小程序、支付宝、百度小程序、今日头条小程序
├─ system 系统更新日志 数据库管理 素材管理
├─ setting 系统身份管理 系统权限管理、系统菜单管理、操作日志
├─ sms 短信设置
├─ systemForm 商城设置
├─ freight 物流设置
├─ maintain 安全维护
├─ safe 维护-页面链接
├─ userFeedback 用户反馈
├─ error-page 错误页
~~~
## 目录结构
主要目录结构及说明:
~~~
├── public # 静态资源
│ ├── favicon.ico # favicon图标
│ └── index.html # html 模板
├── src # 源代码
│ ├── api # 所有接口api
│ │ └──request.js # 请求封装
│ │ └──accounts.js # 有关财务的接口
│ │ └──promoter.js # 有关分销的接口
│ │ └──app.js # 有关应用(小程序、公众号)的接口
│ │ └──cms.js # 有关内容(文章管理、分类)的接口
│ │ └──home.js # 有关首页的接口
│ │ └──order.js # 有关订单的接口
│ │ └──product.js # 有关商品的接口
│ │ └──setting.js # 有关权限管理的接口
│ │ └──system.js # 有关系统配置的接口
│ │ └──systemForm.js # 有关表单组件的接口
│ │ └──maintain.js # 有关安全维护的接口
│ │ └──merchant.js # 有关商户的接口
│ │ └──sms.js # 有关短信设置的接口
│ │ └──user.js # 有关登录、用户的接口
│ │ └──userFeedback.js # 有关用户反馈的接口
│ │ └──freight.js # 有关物流设置的接口
│ ├── assets # 图片、svg 等静态资源
│ ├── icons # svg 等静态资源
│ ├── components # 公共组件
│ │ └──Breadcrumb # 头部标题标签
│ │ └──cards # 统计
│ │ └──echarts # 统计图
│ │ └──goodsList # 商品列表
│ │ └──Hamburger # 导航收缩组件
│ │ └──HeaderSearch # 导航搜索组件
│ │ └──iconFrom # 导航添加图标
│ │ └──newsCategory # 图文组件
│ │ └──RightPanel # 右侧设置按钮,设置导航相关
│ │ └──Screenfull # 全屏
│ │ └──SvgIcon # svg图标
│ │ └──ThemePicker # 右侧设置按钮,设置组题颜色
│ │ └──ueditorFrom # 富文本编辑器
│ │ └──uploadPicture # 上传图片组件
│ ├── layouts # 导航布局
│ │ ├──index # 主页面
│ │ ├──components # 导航组件
│ │ └──Settings # 右边小按钮,设置导航等
│ │ └──Sidebar # 侧边导航
│ │ └──TagsView # tab标签页导航
│ │ └──Navbar # 头部导航
│ │ └──AppMain # 导航路由
│ │ └──index.js # 组件引用
│ │ └──mixins # 自适应大小
│ ├── libs # 公共js方法
│ │ └──settingMer # 配置请求地址
│ ├── views # 所有页面
│ │ └──login # 登录
│ │ └──index # 登录
│ │ └──dashboard # 首页
│ │ └──product # 商品
│ │ └──band # 品牌管理
│ │ └──productClassify # 商品分类
│ │ └──productExamine # 商品审核
│ │ └──productComment # 商品评论管理
│ │ └──order # 订单管理
│ │ └──promoter # 分销
│ │ └──user # 分销员列表
│ │ └──config # 分销设置
│ │ └──cms # 内容
│ │ └──addArticle # 添加文章/编辑文章
│ │ └──article # 文章管理
│ │ └──articleCategory # 文章分类
│ │ └──user # 用户
│ │ └──group # 用户分组
│ │ └──group # 用户标签
│ │ └──list # 用户管理
│ │ └──accounts # 财务
│ │ └──bill # 充值记录
│ │ └──capital # 资金记录
│ │ └──extract # 提现管理
│ │ └──reconciliation # 财务对账
│ │ └──merchant # 商户
│ │ └──list # 商户列表
│ │ └──classify # 商户分类
│ │ └──system # 商户菜单管理
│ │ └──app # 应用
│ │ └──wechat # 公众号
│ │ └──menus # 微信菜单
│ │ └──newsCategory # 图文管理
│ │ └──save # 图文添加
│ │ └──reply # 自动回复
│ │ └──follow # 微信关注回复/无效关键词回复
│ │ └──keyword # 关键字回复
│ │ └──wxTemplate # 微信/小程序模板消息
│ │ └──system # 设置
│ │ └──config # 系统设置
│ │ └──classify # 配置分类
│ │ └──setting # 配置管理
│ │ └──picture # 素材管理
│ │ └──groupData # 组合设置
│ │ └──list # 组合数据
│ │ └──data # 组合数据列表/登录页幻灯片/首页幻灯片/首页导航按钮/首页推荐区/个人中心幻灯片/个人中心菜单/热门搜索/分销特权/分销海报/充值金额配置
│ │ └──setting # 设置-权限管理
│ │ └──systemRole # 身份管理
│ │ └──systemAdmin # 管理员管理
│ │ └──systemLog # 操作日志
│ │ └──systemMenu # 菜单管理
│ │ └──systemForm # 设置-商城设置
│ │ └──setSystem # 基础配置/商城配置/余额充值设置/文件上传/短信提醒开关/公众号支付配置/小程序支付配置/公众号配置/小程序配置
│ │ └──sms # 短信设置
│ │ └──smsConfig # 短信账户
│ │ └──smsTemplate # 短信模板
│ │ └──smsPay # 短信购买
│ │ └──freight # 物流设置
│ │ └──express # 物流公司
│ │ └──maintain # 安全维护
│ │ └──dataBackup # 数据备份
│ │ └──auth # 商业授权
│ │ └──safe # 维护-页面链接
│ │ └──pageLinks # 页面链接
│ │ └──userFeedback # 用户-用户反馈
│ │ └──list # 反馈列表
│ │ └──classify # 反馈分类
│ │ └──error-page # 错误页
│ │ └──404 # 错误页404
│ │ └──403 # 错误页403
│ ├── filters # 过滤器
│ ├── router # 路由配置
│ │ └──modules # 页面路由模块
│ │ └──accounts.js # 有关财务
│ │ └──app.js # 有关应用(公众号)
│ │ └──cms.js # 有关内容(文章管理、文章分类)
│ │ └──config.js # 有关系统配置
│ │ └──freight.js # 有关物流设置
│ │ └──group.js # 有关组合数据
│ │ └──maintain.js # 有关安全维护
│ │ └──merchant.js # 有关商户
│ │ └──order.js # 有关订单
│ │ └──product.js # 有关商品
│ │ └──promoter.js # 有关分销
│ │ └──routine.js # 有关小程序
│ │ └──safe.js # 有关维护
│ │ └──setting.js # 有关权限
│ │ └──sms.js # 有关短信
│ │ └──systemForm.js # 有关商城设置
│ │ └──user.js # 有关用户
│ │ └──feedback.js # 有关用户反馈
│ │ └──index.js # 路由的汇总
│ ├── store # Vuex 状态管理
│ ├── utils # 全局公用方法
│ ├── styles # 样式管理
│ ├── permission.js # 路由拦截
│ ├── setting.js # 业务配置文件
│ ├── main.js # 入口文件 加载组件 初始化等
│ └── App.vue # 入口页面
├── tests # 测试
├── .env.xxx # 环境变量配置
├── .eslintrc.js # eslint 配置项
├── .babelrc # babel-loader 配置
├── .travis.yml # 自动化CI配置
├── vue.config.js # vue-cli 配置
├── postcss.config.js # postcss 配置
└── package.json # package.json
~~~
## 开发打包项目
~~~
# 进入项目目录
$ cd admin-iView
# 安装依赖
$ npm install
# 启动项目(本地开发环境)
$ npm run dev
# 打包项目
## Build
```bash
# build for test environment
npm run build:stage
# build for production environment
npm run build:prod
```
## Advanced
```bash
# preview the release environment effect
npm run preview
# preview the release environment effect + static resource analysis
npm run preview -- --report
# code format check
npm run lint
# code format check and auto fix
npm run lint -- --fix
```

5
babel.config.js Normal file
View File

@ -0,0 +1,5 @@
module.exports = {
presets: [
'@vue/app'
]
}

45
build/index.js Normal file
View File

@ -0,0 +1,45 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
const { run } = require('runjs')
const chalk = require('chalk')
const config = require('../vue.config.js')
const rawArgv = process.argv.slice(2)
const args = rawArgv.join(' ')
if (process.env.npm_config_preview || rawArgv.includes('--preview')) {
const report = rawArgv.includes('--report')
run(`vue-cli-service build ${args}`)
const port = 9526
const publicPath = config.publicPath
var connect = require('connect')
var serveStatic = require('serve-static')
const app = connect()
app.use(
publicPath,
serveStatic('./dist', {
index: ['index.html', '/']
})
)
app.listen(port, function () {
console.log(chalk.green(`> Preview at http://localhost:${port}${publicPath}`))
if (report) {
console.log(chalk.green(`> Report at http://localhost:${port}${publicPath}report.html`))
}
})
} else {
run(`vue-cli-service build ${args}`)
}

24
jest.config.js Normal file
View File

@ -0,0 +1,24 @@
module.exports = {
moduleFileExtensions: ['js', 'jsx', 'json', 'vue'],
transform: {
'^.+\\.vue$': 'vue-jest',
'.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$':
'jest-transform-stub',
'^.+\\.jsx?$': 'babel-jest'
},
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/src/$1'
},
snapshotSerializers: ['jest-serializer-vue'],
testMatch: [
'**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)'
],
collectCoverageFrom: ['src/utils/**/*.{js,vue}', '!src/utils/auth.js', '!src/utils/request.js', 'src/components/**/*.{js,vue}'],
coverageDirectory: '<rootDir>/tests/unit/coverage',
// 'collectCoverage': true,
'coverageReporters': [
'lcov',
'text-summary'
],
testURL: 'http://localhost/'
}

9
jsconfig.json Normal file
View File

@ -0,0 +1,9 @@
{
"compilerOptions": {
"baseUrl": "./",
"paths": {
"@/*": ["src/*"]
}
},
"exclude": ["node_modules", "dist"]
}

125
mock/article.js Normal file
View File

@ -0,0 +1,125 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import Mock from 'mockjs'
const List = []
const count = 100
const baseContent = '<p>I am testing data, I am testing data.</p><p><img src="https://wpimg.wallstcn.com/4c69009c-0fd4-4153-b112-6cb53d1cf943"></p>'
const image_uri = 'https://wpimg.wallstcn.com/e4558086-631c-425c-9430-56ffb46e70b3'
for (let i = 0; i < count; i++) {
List.push(Mock.mock({
id: '@increment',
timestamp: +Mock.Random.date('T'),
author: '@first',
reviewer: '@first',
title: '@title(5, 10)',
content_short: 'mock data',
content: baseContent,
forecast: '@float(0, 100, 2, 2)',
importance: '@integer(1, 3)',
'type|1': ['CN', 'US', 'JP', 'EU'],
'status|1': ['published', 'draft'],
display_time: '@datetime',
comment_disabled: true,
pageviews: '@integer(300, 5000)',
image_uri,
platforms: ['a-platform']
}))
}
export default [
{
url: '/vue-element-admin/article/list',
type: 'get',
response: config => {
const { importance, type, title, page = 1, limit = 20, sort } = config.query
let mockList = List.filter(item => {
if (importance && item.importance !== +importance) return false
if (type && item.type !== type) return false
if (title && item.title.indexOf(title) < 0) return false
return true
})
if (sort === '-id') {
mockList = mockList.reverse()
}
const pageList = mockList.filter((item, index) => index < limit * page && index >= limit * (page - 1))
return {
code: 20000,
data: {
total: mockList.length,
items: pageList
}
}
}
},
{
url: '/vue-element-admin/article/detail',
type: 'get',
response: config => {
const { id } = config.query
for (const article of List) {
if (article.id === +id) {
return {
code: 20000,
data: article
}
}
}
}
},
{
url: '/vue-element-admin/article/pv',
type: 'get',
response: _ => {
return {
code: 20000,
data: {
pvData: [
{ key: 'PC', pv: 1024 },
{ key: 'mobile', pv: 1024 },
{ key: 'ios', pv: 1024 },
{ key: 'android', pv: 1024 }
]
}
}
}
},
{
url: '/vue-element-admin/article/create',
type: 'post',
response: _ => {
return {
code: 20000,
data: 'success'
}
}
},
{
url: '/vue-element-admin/article/update',
type: 'post',
response: _ => {
return {
code: 20000,
data: 'success'
}
}
}
]

66
mock/index.js Normal file
View File

@ -0,0 +1,66 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import Mock from 'mockjs'
import { param2Obj } from '../src/utils'
import user from './user'
import role from './role'
import article from './article'
import search from './remote-search'
const mocks = [
...user,
...role,
...article,
...search
]
// for front mock
// please use it cautiously, it will redefine XMLHttpRequest,
// which will cause many of your third-party libraries to be invalidated(like progress event).
export function mockXHR() {
// mock patch
// https://github.com/nuysoft/Mock/issues/300
Mock.XHR.prototype.proxy_send = Mock.XHR.prototype.send
Mock.XHR.prototype.send = function() {
if (this.custom.xhr) {
this.custom.xhr.withCredentials = this.withCredentials || false
if (this.responseType) {
this.custom.xhr.responseType = this.responseType
}
}
this.proxy_send(...arguments)
}
function XHR2ExpressReqWrap(respond) {
return function(options) {
let result = null
if (respond instanceof Function) {
const { body, type, url } = options
// https://expressjs.com/en/4x/api.html#req
result = respond({
method: type,
body: JSON.parse(body),
query: param2Obj(url)
})
} else {
result = respond
}
return Mock.mock(result)
}
}
for (const i of mocks) {
Mock.mock(new RegExp(i.url), i.type || 'get', XHR2ExpressReqWrap(i.response))
}
}
export default mocks

93
mock/mock-server.js Normal file
View File

@ -0,0 +1,93 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
const chokidar = require('chokidar')
const bodyParser = require('body-parser')
const chalk = require('chalk')
const path = require('path')
const Mock = require('mockjs')
const mockDir = path.join(process.cwd(), 'mock')
function registerRoutes(app) {
let mockLastIndex
const { default: mocks } = require('./index.js')
const mocksForServer = mocks.map(route => {
return responseFake(route.url, route.type, route.response)
})
for (const mock of mocksForServer) {
app[mock.type](mock.url, mock.response)
mockLastIndex = app._router.stack.length
}
const mockRoutesLength = Object.keys(mocksForServer).length
return {
mockRoutesLength: mockRoutesLength,
mockStartIndex: mockLastIndex - mockRoutesLength
}
}
function unregisterRoutes() {
Object.keys(require.cache).forEach(i => {
if (i.includes(mockDir)) {
delete require.cache[require.resolve(i)]
}
})
}
// for mock server
const responseFake = (url, type, respond) => {
return {
url: new RegExp(`${process.env.VUE_APP_BASE_API}${url}`),
type: type || 'get',
response(req, res) {
console.log('request invoke:' + req.path)
res.json(Mock.mock(respond instanceof Function ? respond(req, res) : respond))
}
}
}
module.exports = app => {
// es6 polyfill
require('@babel/register')
// parse app.body
// https://expressjs.com/en/4x/api.html#req.body
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({
extended: true
}))
const mockRoutes = registerRoutes(app)
var mockRoutesLength = mockRoutes.mockRoutesLength
var mockStartIndex = mockRoutes.mockStartIndex
// watch files, hot reload mock server
chokidar.watch(mockDir, {
ignored: /mock-server/,
ignoreInitial: true
}).on('all', (event, path) => {
if (event === 'change' || event === 'add') {
try {
// remove mock routes stack
app._router.stack.splice(mockStartIndex, mockRoutesLength)
// clear routes cache
unregisterRoutes()
const mockRoutes = registerRoutes(app)
mockRoutesLength = mockRoutes.mockRoutesLength
mockStartIndex = mockRoutes.mockStartIndex
console.log(chalk.magentaBright(`\n > Mock Server hot reload success! changed ${path}`))
} catch (error) {
console.log(chalk.redBright(error))
}
}
})
}

60
mock/remote-search.js Normal file
View File

@ -0,0 +1,60 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import Mock from 'mockjs'
const NameList = []
const count = 100
for (let i = 0; i < count; i++) {
NameList.push(Mock.mock({
name: '@first'
}))
}
NameList.push({ name: 'mock-Pan' })
export default [
// username search
{
url: '/vue-element-admin/search/user',
type: 'get',
response: config => {
const { name } = config.query
const mockNameList = NameList.filter(item => {
const lowerCaseName = item.name.toLowerCase()
return !(name && lowerCaseName.indexOf(name.toLowerCase()) < 0)
})
return {
code: 20000,
data: { items: mockNameList }
}
}
},
// transaction list
{
url: '/vue-element-admin/transaction/list',
type: 'get',
response: _ => {
return {
code: 20000,
data: {
total: 20,
'items|20': [{
order_no: '@guid()',
timestamp: +Mock.Random.date('T'),
username: '@name()',
price: '@float(1000, 15000, 0, 2)',
'status|1': ['success', 'pending']
}]
}
}
}
}
]

98
mock/role/index.js Normal file
View File

@ -0,0 +1,98 @@
import Mock from 'mockjs'
import { deepClone } from '../../src/utils/index.js'
import { asyncRoutes, constantRoutes } from './routes.js'
const routes = deepClone([...constantRoutes, ...asyncRoutes])
const roles = [
{
key: 'admin',
name: 'admin',
description: 'Super Administrator. Have access to view all pages.',
routes: routes
},
{
key: 'editor',
name: 'editor',
description: 'Normal Editor. Can see all pages except permission page',
routes: routes.filter(i => i.path !== '/permission')// just a mock
},
{
key: 'visitor',
name: 'visitor',
description: 'Just a visitor. Can only see the home page and the document page',
routes: [{
path: '',
redirect: 'dashboard',
children: [
{
path: 'dashboard',
name: 'Dashboard',
meta: { title: 'dashboard', icon: 'dashboard' }
}
]
}]
}
]
export default [
// mock get all routes form server
{
url: '/vue-element-admin/routes',
type: 'get',
response: _ => {
return {
code: 20000,
data: routes
}
}
},
// mock get all roles form server
{
url: '/vue-element-admin/roles',
type: 'get',
response: _ => {
return {
code: 20000,
data: roles
}
}
},
// add role
{
url: '/vue-element-admin/role',
type: 'post',
response: {
code: 20000,
data: {
key: Mock.mock('@integer(300, 5000)')
}
}
},
// update role
{
url: '/vue-element-admin/role/[A-Za-z0-9]',
type: 'put',
response: {
code: 20000,
data: {
status: 'success'
}
}
},
// delete role
{
url: '/vue-element-admin/role/[A-Za-z0-9]',
type: 'delete',
response: {
code: 20000,
data: {
status: 'success'
}
}
}
]

525
mock/role/routes.js Normal file
View File

@ -0,0 +1,525 @@
// Just a mock data
export const constantRoutes = [
{
path: '/redirect',
component: 'layout/Layout',
hidden: true,
children: [
{
path: '/redirect/:path*',
component: 'views/redirect/index'
}
]
},
{
path: '/login',
component: 'views/login/index',
hidden: true
},
{
path: '/auth-redirect',
component: 'views/login/auth-redirect',
hidden: true
},
{
path: '/404',
component: 'views/error-page/404',
hidden: true
},
{
path: '/401',
component: 'views/error-page/401',
hidden: true
},
{
path: '',
component: 'layout/Layout',
redirect: 'dashboard',
children: [
{
path: 'dashboard',
component: 'views/dashboard/index',
name: 'Dashboard',
meta: { title: 'Dashboard', icon: 'dashboard', affix: true }
}
]
},
{
path: '/documentation',
component: 'layout/Layout',
children: [
{
path: 'index',
component: 'views/documentation/index',
name: 'Documentation',
meta: { title: 'Documentation', icon: 'documentation', affix: true }
}
]
},
{
path: '/guide',
component: 'layout/Layout',
redirect: '/guide/index',
children: [
{
path: 'index',
component: 'views/guide/index',
name: 'Guide',
meta: { title: 'Guide', icon: 'guide', noCache: true }
}
]
}
]
export const asyncRoutes = [
{
path: '/permission',
component: 'layout/Layout',
redirect: '/permission/index',
alwaysShow: true,
meta: {
title: 'Permission',
icon: 'lock',
roles: ['admin', 'editor']
},
children: [
{
path: 'page',
component: 'views/permission/page',
name: 'PagePermission',
meta: {
title: 'Page Permission',
roles: ['admin']
}
},
{
path: 'directive',
component: 'views/permission/directive',
name: 'DirectivePermission',
meta: {
title: 'Directive Permission'
}
},
{
path: 'role',
component: 'views/permission/role',
name: 'RolePermission',
meta: {
title: 'Role Permission',
roles: ['admin']
}
}
]
},
{
path: '/icon',
component: 'layout/Layout',
children: [
{
path: 'index',
component: 'views/icons/index',
name: 'Icons',
meta: { title: 'Icons', icon: 'icon', noCache: true }
}
]
},
{
path: '/components',
component: 'layout/Layout',
redirect: 'noRedirect',
name: 'ComponentDemo',
meta: {
title: 'Components',
icon: 'component'
},
children: [
{
path: 'tinymce',
component: 'views/components-demo/tinymce',
name: 'TinymceDemo',
meta: { title: 'Tinymce' }
},
{
path: 'markdown',
component: 'views/components-demo/markdown',
name: 'MarkdownDemo',
meta: { title: 'Markdown' }
},
{
path: 'json-editor',
component: 'views/components-demo/json-editor',
name: 'JsonEditorDemo',
meta: { title: 'Json Editor' }
},
{
path: 'split-pane',
component: 'views/components-demo/split-pane',
name: 'SplitpaneDemo',
meta: { title: 'SplitPane' }
},
{
path: 'avatar-upload',
component: 'views/components-demo/avatar-upload',
name: 'AvatarUploadDemo',
meta: { title: 'Avatar Upload' }
},
{
path: 'dropzone',
component: 'views/components-demo/dropzone',
name: 'DropzoneDemo',
meta: { title: 'Dropzone' }
},
{
path: 'sticky',
component: 'views/components-demo/sticky',
name: 'StickyDemo',
meta: { title: 'Sticky' }
},
{
path: 'count-to',
component: 'views/components-demo/count-to',
name: 'CountToDemo',
meta: { title: 'Count To' }
},
{
path: 'mixin',
component: 'views/components-demo/mixin',
name: 'ComponentMixinDemo',
meta: { title: 'componentMixin' }
},
{
path: 'back-to-top',
component: 'views/components-demo/back-to-top',
name: 'BackToTopDemo',
meta: { title: 'Back To Top' }
},
{
path: 'drag-dialog',
component: 'views/components-demo/drag-dialog',
name: 'DragDialogDemo',
meta: { title: 'Drag Dialog' }
},
{
path: 'drag-select',
component: 'views/components-demo/drag-select',
name: 'DragSelectDemo',
meta: { title: 'Drag Select' }
},
{
path: 'dnd-list',
component: 'views/components-demo/dnd-list',
name: 'DndListDemo',
meta: { title: 'Dnd List' }
},
{
path: 'drag-kanban',
component: 'views/components-demo/drag-kanban',
name: 'DragKanbanDemo',
meta: { title: 'Drag Kanban' }
}
]
},
{
path: '/charts',
component: 'layout/Layout',
redirect: 'noRedirect',
name: 'Charts',
meta: {
title: 'Charts',
icon: 'chart'
},
children: [
{
path: 'keyboard',
component: 'views/charts/keyboard',
name: 'KeyboardChart',
meta: { title: 'Keyboard Chart', noCache: true }
},
{
path: 'line',
component: 'views/charts/line',
name: 'LineChart',
meta: { title: 'Line Chart', noCache: true }
},
{
path: 'mixchart',
component: 'views/charts/mixChart',
name: 'MixChart',
meta: { title: 'Mix Chart', noCache: true }
}
]
},
{
path: '/nested',
component: 'layout/Layout',
redirect: '/nested/menu1/menu1-1',
name: 'Nested',
meta: {
title: 'Nested',
icon: 'nested'
},
children: [
{
path: 'menu1',
component: 'views/nested/menu1/index',
name: 'Menu1',
meta: { title: 'Menu1' },
redirect: '/nested/menu1/menu1-1',
children: [
{
path: 'menu1-1',
component: 'views/nested/menu1/menu1-1',
name: 'Menu1-1',
meta: { title: 'Menu1-1' }
},
{
path: 'menu1-2',
component: 'views/nested/menu1/menu1-2',
name: 'Menu1-2',
redirect: '/nested/menu1/menu1-2/menu1-2-1',
meta: { title: 'Menu1-2' },
children: [
{
path: 'menu1-2-1',
component: 'views/nested/menu1/menu1-2/menu1-2-1',
name: 'Menu1-2-1',
meta: { title: 'Menu1-2-1' }
},
{
path: 'menu1-2-2',
component: 'views/nested/menu1/menu1-2/menu1-2-2',
name: 'Menu1-2-2',
meta: { title: 'Menu1-2-2' }
}
]
},
{
path: 'menu1-3',
component: 'views/nested/menu1/menu1-3',
name: 'Menu1-3',
meta: { title: 'Menu1-3' }
}
]
},
{
path: 'menu2',
name: 'Menu2',
component: 'views/nested/menu2/index',
meta: { title: 'Menu2' }
}
]
},
{
path: '/example',
component: 'layout/Layout',
redirect: '/example/list',
name: 'Example',
meta: {
title: 'Example',
icon: 'example'
},
children: [
{
path: 'create',
component: 'views/example/create',
name: 'CreateArticle',
meta: { title: 'Create Article', icon: 'edit' }
},
{
path: 'edit/:id(\\d+)',
component: 'views/example/edit',
name: 'EditArticle',
meta: { title: 'Edit Article', noCache: true },
hidden: true
},
{
path: 'list',
component: 'views/example/list',
name: 'ArticleList',
meta: { title: 'Article List', icon: 'list' }
}
]
},
{
path: '/tab',
component: 'layout/Layout',
children: [
{
path: 'index',
component: 'views/tab/index',
name: 'Tab',
meta: { title: 'Tab', icon: 'tab' }
}
]
},
{
path: '/error',
component: 'layout/Layout',
redirect: 'noRedirect',
name: 'ErrorPages',
meta: {
title: 'Error Pages',
icon: '404'
},
children: [
{
path: '401',
component: 'views/error-page/401',
name: 'Page401',
meta: { title: 'Page 401', noCache: true }
},
{
path: '404',
component: 'views/error-page/404',
name: 'Page404',
meta: { title: 'Page 404', noCache: true }
}
]
},
{
path: '/error-log',
component: 'layout/Layout',
redirect: 'noRedirect',
children: [
{
path: 'log',
component: 'views/error-log/index',
name: 'ErrorLog',
meta: { title: 'Error Log', icon: 'bug' }
}
]
},
{
path: '/excel',
component: 'layout/Layout',
redirect: '/excel/export-excel',
name: 'Excel',
meta: {
title: 'Excel',
icon: 'excel'
},
children: [
{
path: 'export-excel',
component: 'views/excel/export-excel',
name: 'ExportExcel',
meta: { title: 'Export Excel' }
},
{
path: 'export-selected-excel',
component: 'views/excel/select-excel',
name: 'SelectExcel',
meta: { title: 'Select Excel' }
},
{
path: 'export-merge-header',
component: 'views/excel/merge-header',
name: 'MergeHeader',
meta: { title: 'Merge Header' }
},
{
path: 'upload-excel',
component: 'views/excel/upload-excel',
name: 'UploadExcel',
meta: { title: 'Upload Excel' }
}
]
},
{
path: '/zip',
component: 'layout/Layout',
redirect: '/zip/download',
alwaysShow: true,
meta: { title: 'Zip', icon: 'zip' },
children: [
{
path: 'download',
component: 'views/zip/index',
name: 'ExportZip',
meta: { title: 'Export Zip' }
}
]
},
{
path: '/pdf',
component: 'layout/Layout',
redirect: '/pdf/index',
children: [
{
path: 'index',
component: 'views/pdf/index',
name: 'PDF',
meta: { title: 'PDF', icon: 'pdf' }
}
]
},
{
path: '/pdf/download',
component: 'views/pdf/download',
hidden: true
},
{
path: '/theme',
component: 'layout/Layout',
redirect: 'noRedirect',
children: [
{
path: 'index',
component: 'views/theme/index',
name: 'Theme',
meta: { title: 'Theme', icon: 'theme' }
}
]
},
{
path: '/clipboard',
component: 'layout/Layout',
redirect: 'noRedirect',
children: [
{
path: 'index',
component: 'views/clipboard/index',
name: 'ClipboardDemo',
meta: { title: 'Clipboard Demo', icon: 'clipboard' }
}
]
},
{
path: '/i18n',
component: 'layout/Layout',
children: [
{
path: 'index',
component: 'views/i18n-demo/index',
name: 'I18n',
meta: { title: 'I18n', icon: 'international' }
}
]
},
{
path: 'external-link',
component: 'layout/Layout',
children: [
{
path: 'https://github.com/PanJiaChen/vue-element-admin',
meta: { title: 'External Link', icon: 'link' }
}
]
},
{ path: '*', redirect: '/404', hidden: true }
]

92
mock/user.js Normal file
View File

@ -0,0 +1,92 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
const tokens = {
admin: {
token: 'admin-token'
},
editor: {
token: 'editor-token'
}
}
const users = {
'admin-token': {
roles: ['admin'],
introduction: 'I am a super administrator',
avatar: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif',
name: 'Super Admin'
},
'editor-token': {
roles: ['editor'],
introduction: 'I am an editor',
avatar: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif',
name: 'Normal Editor'
}
}
export default [
// user login
{
url: '/vue-element-admin/user/login',
type: 'post',
response: config => {
const { username } = config.body
const token = tokens[username]
// mock error
if (!token) {
return {
code: 60204,
message: 'Account and password are incorrect.'
}
}
return {
code: 20000,
data: token
}
}
},
// get user info
{
url: '/vue-element-admin/user/info\.*',
type: 'get',
response: config => {
const { token } = config.query
const info = users[token]
// mock error
if (!info) {
return {
code: 50008,
message: 'Login failed, unable to get user details.'
}
}
return {
code: 20000,
data: info
}
}
},
// user logout
{
url: '/vue-element-admin/user/logout',
type: 'post',
response: _ => {
return {
code: 20000,
data: 'success'
}
}
}
]

136
package.json Normal file
View File

@ -0,0 +1,136 @@
{
"name": "vue-element-admin",
"version": "4.2.1",
"description": "A magical vue admin. An out-of-box UI solution for enterprise applications. Newest development stack of vue. Lots of awesome features",
"author": "Pan <panfree23@gmail.com>",
"license": "MIT",
"scripts": {
"dev": "vue-cli-service serve",
"build:prod": "vue-cli-service build",
"build:stage": "vue-cli-service build --mode staging",
"preview": "node build/index.js --preview",
"lint": "eslint --ext .js,.vue src",
"test:unit": "jest --clearCache && vue-cli-service test:unit",
"test:ci": "npm run lint && npm run test:unit",
"svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml",
"new": "plop"
},
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"src/**/*.{js,vue}": [
"eslint --fix",
"git add"
]
},
"keywords": [
"vue",
"admin",
"dashboard",
"element-ui",
"boilerplate",
"admin-template",
"management-system"
],
"repository": {
"type": "git",
"url": "git+https://github.com/PanJiaChen/vue-element-admin.git"
},
"bugs": {
"url": "https://github.com/PanJiaChen/vue-element-admin/issues"
},
"dependencies": {
"@form-create/element-ui": "2.5",
"@jiaminghi/data-view": "^2.10.0",
"axios": "0.18.1",
"clipboard": "^2.0.6",
"codemirror": "5.45.0",
"core-js": "^2.6.12",
"cos-js-sdk-v5": "^1.4.5",
"crypto-js": "^4.1.1",
"driver.js": "0.9.5",
"dropzone": "5.5.1",
"echarts": "^5.4.0",
"element-ui": "^2.15.12",
"exceljs": "^4.3.0",
"file-saver": "2.0.1",
"fuse.js": "3.4.4",
"html2canvas": "^1.1.0",
"js-cookie": "2.2.0",
"jsonlint": "1.6.3",
"jszip": "3.2.1",
"krry-transfer": "^1.2.21",
"lowdb": "^1.0.0",
"moment": "^2.29.1",
"monaco-editor": "^0.19.3",
"node-sass": "^4.13.1",
"normalize.css": "7.0.0",
"nprogress": "0.2.0",
"path-to-regexp": "2.4.0",
"qiniu-js": "^3.4.1",
"qrcodejs2": "0.0.2",
"screenfull": "4.2.0",
"script-loader": "0.7.2",
"showdown": "1.9.0",
"sortablejs": "1.8.4",
"v-viewer": "^1.5.1",
"vue": "2.6.10",
"vue-awesome-swiper": "^3.1.3",
"vue-count-to": "1.0.13",
"vue-easytable": "^2.27.1",
"vue-qr": "^2.5.0",
"vue-router": "3.0.2",
"vue-seamless-scroll": "^1.1.23",
"vue-splitpane": "1.0.4",
"vue-ueditor-wrap": "^2.4.1",
"vue-waterfall-easy": "^2.4.4",
"vuedraggable": "2.20.0",
"vuex": "3.1.0",
"wangeditor": "^4.7.12",
"xlsx": "0.14.1"
},
"devDependencies": {
"@babel/core": "7.0.0",
"@babel/register": "7.0.0",
"@vue/cli-plugin-babel": "3.5.3",
"@vue/cli-plugin-eslint": "^3.9.1",
"@vue/cli-plugin-unit-jest": "3.5.3",
"@vue/cli-service": "3.5.3",
"@vue/test-utils": "1.0.0-beta.29",
"autoprefixer": "^9.5.1",
"babel-core": "7.0.0-bridge.0",
"babel-eslint": "10.0.1",
"babel-jest": "23.6.0",
"cache-loader": "^2.0.1",
"chalk": "2.4.2",
"chokidar": "2.1.5",
"connect": "3.6.6",
"eslint": "5.15.3",
"eslint-plugin-vue": "5.2.2",
"html-webpack-plugin": "3.2.0",
"husky": "1.3.1",
"lint-staged": "8.1.5",
"mockjs": "1.0.1-beta3",
"plop": "2.3.0",
"runjs": "^4.3.2",
"sass-loader": "^7.3.1",
"script-ext-html-webpack-plugin": "2.1.3",
"serve-static": "^1.13.2",
"svg-sprite-loader": "4.1.3",
"svgo": "1.2.0",
"vue-lazyload": "^1.3.3",
"vue-template-compiler": "2.6.10",
"webpack": "^4.44.2"
},
"engines": {
"node": ">=8.9",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions"
]
}

View File

@ -0,0 +1,69 @@
diff --git a/node_modules/element-ui/lib/cascader-panel.js b/node_modules/element-ui/lib/cascader-panel.js
index 0f3f827..aba337b 100644
--- a/node_modules/element-ui/lib/cascader-panel.js
+++ b/node_modules/element-ui/lib/cascader-panel.js
@@ -1050,7 +1050,7 @@ var store_Store = function () {
};
Store.prototype.getNodeByValue = function getNodeByValue(value) {
- if (value) {
+ if (value || value === 0) {
var nodes = this.getFlattedNodes(false, !this.config.lazy).filter(function (node) {
return Object(util_["valueEquals"])(node.path, value) || node.value === value;
});
diff --git a/node_modules/element-ui/lib/cascader.js b/node_modules/element-ui/lib/cascader.js
index ee4bc3d..d39b5a4 100644
--- a/node_modules/element-ui/lib/cascader.js
+++ b/node_modules/element-ui/lib/cascader.js
@@ -911,7 +911,7 @@ var InputSizeMap = {
data: function data() {
return {
dropDownVisible: false,
- checkedValue: this.value || null,
+ checkedValue: this.value,
inputHover: false,
inputValue: null,
presentText: null,
@@ -1039,7 +1039,7 @@ var InputSizeMap = {
this.inputInitialHeight = input.$el.offsetHeight || InputSizeMap[this.realSize] || 40;
}
- if (!Object(util_["isEmpty"])(this.value)) {
+ if (this.value === 0 || !Object(util_["isEmpty"])(this.value)) {
this.computePresentContent();
}
@@ -1189,7 +1189,7 @@ var InputSizeMap = {
var checkedValue = this.checkedValue,
config = this.config;
- if (!Object(util_["isEmpty"])(checkedValue)) {
+ if (checkedValue === 0 || !Object(util_["isEmpty"])(checkedValue)) {
var node = this.panel.getNodeByValue(checkedValue);
if (node && (config.checkStrictly || node.isLeaf)) {
this.presentText = node.getText(this.showAllLevels, this.separator);
diff --git a/node_modules/element-ui/lib/utils/util.js b/node_modules/element-ui/lib/utils/util.js
index 1ced2ab..bfa9001 100644
--- a/node_modules/element-ui/lib/utils/util.js
+++ b/node_modules/element-ui/lib/utils/util.js
@@ -215,7 +215,7 @@ var isEmpty = exports.isEmpty = function isEmpty(val) {
if (typeof val === 'boolean') return false;
- if (typeof val === 'number') return !val;
+ if (typeof val === 'number') return false;
if (val instanceof Error) return val.message === '';
diff --git a/node_modules/element-ui/packages/.DS_Store b/node_modules/element-ui/packages/.DS_Store
deleted file mode 100644
index 1c1f7f4..0000000
Binary files a/node_modules/element-ui/packages/.DS_Store and /dev/null differ
diff --git a/node_modules/element-ui/packages/theme-chalk/src/.DS_Store b/node_modules/element-ui/packages/theme-chalk/src/.DS_Store
deleted file mode 100644
index 94b4cf9..0000000
Binary files a/node_modules/element-ui/packages/theme-chalk/src/.DS_Store and /dev/null differ
diff --git a/node_modules/element-ui/packages/theme-chalk/src/fonts/.DS_Store b/node_modules/element-ui/packages/theme-chalk/src/fonts/.DS_Store
deleted file mode 100644
index 5008ddf..0000000
Binary files a/node_modules/element-ui/packages/theme-chalk/src/fonts/.DS_Store and /dev/null differ

View File

@ -0,0 +1,26 @@
{{#if template}}
<template>
<div />
</template>
{{/if}}
{{#if script}}
<script>
export default {
name: '{{ properCase name }}',
props: {},
data() {
return {}
},
created() {},
mounted() {},
methods: {}
}
</script>
{{/if}}
{{#if style}}
<style lang="scss" scoped>
</style>
{{/if}}

View File

@ -0,0 +1,64 @@
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
const { notEmpty } = require('../utils.js')
module.exports = {
description: 'generate vue component',
prompts: [{
type: 'input',
name: 'name',
message: 'component name please',
validate: notEmpty('name')
},
{
type: 'checkbox',
name: 'blocks',
message: 'Blocks:',
choices: [{
name: '<template>',
value: 'template',
checked: true
},
{
name: '<script>',
value: 'script',
checked: true
},
{
name: 'style',
value: 'style',
checked: true
}
],
validate(value) {
if (value.indexOf('script') === -1 && value.indexOf('template') === -1) {
return 'Components require at least a <script> or <template> tag.'
}
return true
}
}
],
actions: data => {
const name = '{{properCase name}}'
const actions = [{
type: 'add',
path: `src/components/${name}/index.vue`,
templateFile: 'plop-templates/component/index.hbs',
data: {
name: name,
template: data.blocks.includes('template'),
script: data.blocks.includes('script'),
style: data.blocks.includes('style')
}
}]
return actions
}
}

View File

@ -0,0 +1,16 @@
{{#if state}}
const state = {}
{{/if}}
{{#if mutations}}
const mutations = {}
{{/if}}
{{#if actions}}
const actions = {}
{{/if}}
export default {
namespaced: true,
{{options}}
}

View File

@ -0,0 +1,62 @@
const { notEmpty } = require('../utils.js')
module.exports = {
description: 'generate store',
prompts: [{
type: 'input',
name: 'name',
message: 'store name please',
validate: notEmpty('name')
},
{
type: 'checkbox',
name: 'blocks',
message: 'Blocks:',
choices: [{
name: 'state',
value: 'state',
checked: true
},
{
name: 'mutations',
value: 'mutations',
checked: true
},
{
name: 'actions',
value: 'actions',
checked: true
}
],
validate(value) {
if (!value.includes('state') || !value.includes('mutations')) {
return 'store require at least state and mutations'
}
return true
}
}
],
actions(data) {
const name = '{{name}}'
const { blocks } = data
const options = ['state', 'mutations']
const joinFlag = `,
`
if (blocks.length === 3) {
options.push('actions')
}
const actions = [{
type: 'add',
path: `src/store/modules/${name}.js`,
templateFile: 'plop-templates/store/index.hbs',
data: {
options: options.join(joinFlag),
state: blocks.includes('state'),
mutations: blocks.includes('mutations'),
actions: blocks.includes('actions')
}
}]
return actions
}
}

9
plop-templates/utils.js Normal file
View File

@ -0,0 +1,9 @@
exports.notEmpty = name => {
return v => {
if (!v || v.trim === '') {
return `${name} is required`
} else {
return true
}
}
}

View File

@ -0,0 +1,26 @@
{{#if template}}
<template>
<div />
</template>
{{/if}}
{{#if script}}
<script>
export default {
name: '{{ properCase name }}',
props: {},
data() {
return {}
},
created() {},
mounted() {},
methods: {}
}
</script>
{{/if}}
{{#if style}}
<style lang="scss" scoped>
</style>
{{/if}}

View File

@ -0,0 +1,55 @@
const { notEmpty } = require('../utils.js')
module.exports = {
description: 'generate a view',
prompts: [{
type: 'input',
name: 'name',
message: 'view name please',
validate: notEmpty('name')
},
{
type: 'checkbox',
name: 'blocks',
message: 'Blocks:',
choices: [{
name: '<template>',
value: 'template',
checked: true
},
{
name: '<script>',
value: 'script',
checked: true
},
{
name: 'style',
value: 'style',
checked: true
}
],
validate(value) {
if (value.indexOf('script') === -1 && value.indexOf('template') === -1) {
return 'View require at least a <script> or <template> tag.'
}
return true
}
}
],
actions: data => {
const name = '{{name}}'
const actions = [{
type: 'add',
path: `src/views/${name}/index.vue`,
templateFile: 'plop-templates/view/index.hbs',
data: {
name: name,
template: data.blocks.includes('template'),
script: data.blocks.includes('script'),
style: data.blocks.includes('style')
}
}]
return actions
}
}

9
plopfile.js Normal file
View File

@ -0,0 +1,9 @@
const viewGenerator = require('./plop-templates/view/prompt')
const componentGenerator = require('./plop-templates/component/prompt')
const storeGenerator = require('./plop-templates/store/prompt.js')
module.exports = function(plop) {
plop.setGenerator('view', viewGenerator)
plop.setGenerator('component', componentGenerator)
plop.setGenerator('store', storeGenerator)
}

5
postcss.config.js Normal file
View File

@ -0,0 +1,5 @@
module.exports = {
plugins: {
autoprefixer: {}
}
}

View File

@ -0,0 +1,40 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style type="text/css">
*{color: #838383;margin: 0;padding: 0}
html,body {font-size: 12px;overflow: hidden; }
.content{padding:5px 0 0 15px;}
input{width:210px;height:21px;line-height:21px;margin-left: 4px;}
</style>
</head>
<body>
<div class="content">
<span><var id="lang_input_anchorName"></var></span><input id="anchorName" value="" />
</div>
<script type="text/javascript" src="../internal.js"></script>
<script type="text/javascript">
var anchorInput = $G('anchorName'),
node = editor.selection.getRange().getClosedNode();
if(node && node.tagName == 'IMG' && (node = node.getAttribute('anchorname'))){
anchorInput.value = node;
}
anchorInput.onkeydown = function(evt){
evt = evt || window.event;
if(evt.keyCode == 13){
editor.execCommand('anchor', anchorInput.value);
dialog.close();
domUtils.preventDefault(evt)
}
};
dialog.onok = function (){
editor.execCommand('anchor', anchorInput.value);
dialog.close();
};
$focus(anchorInput);
</script>
</body>
</html>

View File

@ -0,0 +1,681 @@
@charset "utf-8";
/* dialog样式 */
.wrapper {
zoom: 1;
width: 630px;
*width: 626px;
height: 380px;
margin: 0 auto;
padding: 10px;
position: relative;
font-family: sans-serif;
}
/*tab样式框大小*/
.tabhead {
float:left;
}
.tabbody {
width: 100%;
height: 346px;
position: relative;
clear: both;
}
.tabbody .panel {
position: absolute;
width: 0;
height: 0;
background: #fff;
overflow: hidden;
display: none;
}
.tabbody .panel.focus {
width: 100%;
height: 346px;
display: block;
}
/* 上传附件 */
.tabbody #upload.panel {
width: 0;
height: 0;
overflow: hidden;
position: absolute !important;
clip: rect(1px, 1px, 1px, 1px);
background: #fff;
display: block;
}
.tabbody #upload.panel.focus {
width: 100%;
height: 346px;
display: block;
clip: auto;
}
#upload .queueList {
margin: 0;
width: 100%;
height: 100%;
position: absolute;
overflow: hidden;
}
#upload p {
margin: 0;
}
.element-invisible {
width: 0 !important;
height: 0 !important;
border: 0;
padding: 0;
margin: 0;
overflow: hidden;
position: absolute !important;
clip: rect(1px, 1px, 1px, 1px);
}
#upload .placeholder {
margin: 10px;
border: 2px dashed #e6e6e6;
*border: 0px dashed #e6e6e6;
height: 172px;
padding-top: 150px;
text-align: center;
background: url(./images/image.png) center 70px no-repeat;
color: #cccccc;
font-size: 18px;
position: relative;
top:0;
*top: 10px;
}
#upload .placeholder .webuploader-pick {
font-size: 18px;
background: #00b7ee;
border-radius: 3px;
line-height: 44px;
padding: 0 30px;
*width: 120px;
color: #fff;
display: inline-block;
margin: 0 auto 20px auto;
cursor: pointer;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}
#upload .placeholder .webuploader-pick-hover {
background: #00a2d4;
}
#filePickerContainer {
text-align: center;
}
#upload .placeholder .flashTip {
color: #666666;
font-size: 12px;
position: absolute;
width: 100%;
text-align: center;
bottom: 20px;
}
#upload .placeholder .flashTip a {
color: #0785d1;
text-decoration: none;
}
#upload .placeholder .flashTip a:hover {
text-decoration: underline;
}
#upload .placeholder.webuploader-dnd-over {
border-color: #999999;
}
#upload .filelist {
list-style: none;
margin: 0;
padding: 0;
overflow-x: hidden;
overflow-y: auto;
position: relative;
height: 300px;
}
#upload .filelist:after {
content: '';
display: block;
width: 0;
height: 0;
overflow: hidden;
clear: both;
}
#upload .filelist li {
width: 113px;
height: 113px;
background: url(./images/bg.png);
text-align: center;
margin: 9px 0 0 9px;
*margin: 6px 0 0 6px;
position: relative;
display: block;
float: left;
overflow: hidden;
font-size: 12px;
}
#upload .filelist li p.log {
position: relative;
top: -45px;
}
#upload .filelist li p.title {
position: absolute;
top: 0;
left: 0;
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
top: 5px;
text-indent: 5px;
text-align: left;
}
#upload .filelist li p.progress {
position: absolute;
width: 100%;
bottom: 0;
left: 0;
height: 8px;
overflow: hidden;
z-index: 50;
margin: 0;
border-radius: 0;
background: none;
-webkit-box-shadow: 0 0 0;
}
#upload .filelist li p.progress span {
display: none;
overflow: hidden;
width: 0;
height: 100%;
background: #1483d8 url(./images/progress.png) repeat-x;
-webit-transition: width 200ms linear;
-moz-transition: width 200ms linear;
-o-transition: width 200ms linear;
-ms-transition: width 200ms linear;
transition: width 200ms linear;
-webkit-animation: progressmove 2s linear infinite;
-moz-animation: progressmove 2s linear infinite;
-o-animation: progressmove 2s linear infinite;
-ms-animation: progressmove 2s linear infinite;
animation: progressmove 2s linear infinite;
-webkit-transform: translateZ(0);
}
@-webkit-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@-moz-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
#upload .filelist li p.imgWrap {
position: relative;
z-index: 2;
line-height: 113px;
vertical-align: middle;
overflow: hidden;
width: 113px;
height: 113px;
-webkit-transform-origin: 50% 50%;
-moz-transform-origin: 50% 50%;
-o-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webit-transition: 200ms ease-out;
-moz-transition: 200ms ease-out;
-o-transition: 200ms ease-out;
-ms-transition: 200ms ease-out;
transition: 200ms ease-out;
}
#upload .filelist li p.imgWrap.notimage {
margin-top: 0;
width: 111px;
height: 111px;
border: 1px #eeeeee solid;
}
#upload .filelist li p.imgWrap.notimage i.file-preview {
margin-top: 15px;
}
#upload .filelist li img {
width: 100%;
}
#upload .filelist li p.error {
background: #f43838;
color: #fff;
position: absolute;
bottom: 0;
left: 0;
height: 28px;
line-height: 28px;
width: 100%;
z-index: 100;
display:none;
}
#upload .filelist li .success {
display: block;
position: absolute;
left: 0;
bottom: 0;
height: 40px;
width: 100%;
z-index: 200;
background: url(./images/success.png) no-repeat right bottom;
background-image: url(./images/success.gif) \9;
}
#upload .filelist li.filePickerBlock {
width: 113px;
height: 113px;
background: url(./images/image.png) no-repeat center 12px;
border: 1px solid #eeeeee;
border-radius: 0;
}
#upload .filelist li.filePickerBlock div.webuploader-pick {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
opacity: 0;
background: none;
font-size: 0;
}
#upload .filelist div.file-panel {
position: absolute;
height: 0;
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#80000000', endColorstr='#80000000') \0;
background: rgba(0, 0, 0, 0.5);
width: 100%;
top: 0;
left: 0;
overflow: hidden;
z-index: 300;
}
#upload .filelist div.file-panel span {
width: 24px;
height: 24px;
display: inline;
float: right;
text-indent: -9999px;
overflow: hidden;
background: url(./images/icons.png) no-repeat;
background: url(./images/icons.gif) no-repeat \9;
margin: 5px 1px 1px;
cursor: pointer;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
#upload .filelist div.file-panel span.rotateLeft {
display:none;
background-position: 0 -24px;
}
#upload .filelist div.file-panel span.rotateLeft:hover {
background-position: 0 0;
}
#upload .filelist div.file-panel span.rotateRight {
display:none;
background-position: -24px -24px;
}
#upload .filelist div.file-panel span.rotateRight:hover {
background-position: -24px 0;
}
#upload .filelist div.file-panel span.cancel {
background-position: -48px -24px;
}
#upload .filelist div.file-panel span.cancel:hover {
background-position: -48px 0;
}
#upload .statusBar {
height: 45px;
border-bottom: 1px solid #dadada;
margin: 0 10px;
padding: 0;
line-height: 45px;
vertical-align: middle;
position: relative;
}
#upload .statusBar .progress {
border: 1px solid #1483d8;
width: 198px;
background: #fff;
height: 18px;
position: absolute;
top: 12px;
display: none;
text-align: center;
line-height: 18px;
color: #6dbfff;
margin: 0 10px 0 0;
}
#upload .statusBar .progress span.percentage {
width: 0;
height: 100%;
left: 0;
top: 0;
background: #1483d8;
position: absolute;
}
#upload .statusBar .progress span.text {
position: relative;
z-index: 10;
}
#upload .statusBar .info {
display: inline-block;
font-size: 14px;
color: #666666;
}
#upload .statusBar .btns {
position: absolute;
top: 7px;
right: 0;
line-height: 30px;
}
#filePickerBtn {
display: inline-block;
float: left;
}
#upload .statusBar .btns .webuploader-pick,
#upload .statusBar .btns .uploadBtn,
#upload .statusBar .btns .uploadBtn.state-uploading,
#upload .statusBar .btns .uploadBtn.state-paused {
background: #ffffff;
border: 1px solid #cfcfcf;
color: #565656;
padding: 0 18px;
display: inline-block;
border-radius: 3px;
margin-left: 10px;
cursor: pointer;
font-size: 14px;
float: left;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
#upload .statusBar .btns .webuploader-pick-hover,
#upload .statusBar .btns .uploadBtn:hover,
#upload .statusBar .btns .uploadBtn.state-uploading:hover,
#upload .statusBar .btns .uploadBtn.state-paused:hover {
background: #f0f0f0;
}
#upload .statusBar .btns .uploadBtn,
#upload .statusBar .btns .uploadBtn.state-paused{
background: #00b7ee;
color: #fff;
border-color: transparent;
}
#upload .statusBar .btns .uploadBtn:hover,
#upload .statusBar .btns .uploadBtn.state-paused:hover{
background: #00a2d4;
}
#upload .statusBar .btns .uploadBtn.disabled {
pointer-events: none;
filter:alpha(opacity=60);
-moz-opacity:0.6;
-khtml-opacity: 0.6;
opacity: 0.6;
}
/* 图片管理样式 */
#online {
width: 100%;
height: 336px;
padding: 10px 0 0 0;
}
#online #fileList{
width: 100%;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
position: relative;
}
#online ul {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
#online li {
float: left;
display: block;
list-style: none;
padding: 0;
width: 113px;
height: 113px;
margin: 0 0 9px 9px;
*margin: 0 0 6px 6px;
background-color: #eee;
overflow: hidden;
cursor: pointer;
position: relative;
}
#online li.clearFloat {
float: none;
clear: both;
display: block;
width:0;
height:0;
margin: 0;
padding: 0;
}
#online li img {
cursor: pointer;
}
#online li div.file-wrapper {
cursor: pointer;
position: absolute;
display: block;
width: 111px;
height: 111px;
border: 1px solid #eee;
background: url("./images/bg.png") repeat;
}
#online li div span.file-title{
display: block;
padding: 0 3px;
margin: 3px 0 0 0;
font-size: 12px;
height: 13px;
color: #555555;
text-align: center;
width: 107px;
white-space: nowrap;
word-break: break-all;
overflow: hidden;
text-overflow: ellipsis;
}
#online li .icon {
cursor: pointer;
width: 113px;
height: 113px;
position: absolute;
top: 0;
left: 0;
z-index: 2;
border: 0;
background-repeat: no-repeat;
}
#online li .icon:hover {
width: 107px;
height: 107px;
border: 3px solid #1094fa;
}
#online li.selected .icon {
background-image: url(images/success.png);
background-image: url(images/success.gif) \9;
background-position: 75px 75px;
}
#online li.selected .icon:hover {
width: 107px;
height: 107px;
border: 3px solid #1094fa;
background-position: 72px 72px;
}
/* 在线文件的文件预览图标 */
i.file-preview {
display: block;
margin: 10px auto;
width: 70px;
height: 70px;
background-image: url("./images/file-icons.png");
background-image: url("./images/file-icons.gif") \9;
background-position: -140px center;
background-repeat: no-repeat;
}
i.file-preview.file-type-dir{
background-position: 0 center;
}
i.file-preview.file-type-file{
background-position: -140px center;
}
i.file-preview.file-type-filelist{
background-position: -210px center;
}
i.file-preview.file-type-zip,
i.file-preview.file-type-rar,
i.file-preview.file-type-7z,
i.file-preview.file-type-tar,
i.file-preview.file-type-gz,
i.file-preview.file-type-bz2{
background-position: -280px center;
}
i.file-preview.file-type-xls,
i.file-preview.file-type-xlsx{
background-position: -350px center;
}
i.file-preview.file-type-doc,
i.file-preview.file-type-docx{
background-position: -420px center;
}
i.file-preview.file-type-ppt,
i.file-preview.file-type-pptx{
background-position: -490px center;
}
i.file-preview.file-type-vsd{
background-position: -560px center;
}
i.file-preview.file-type-pdf{
background-position: -630px center;
}
i.file-preview.file-type-txt,
i.file-preview.file-type-md,
i.file-preview.file-type-json,
i.file-preview.file-type-htm,
i.file-preview.file-type-xml,
i.file-preview.file-type-html,
i.file-preview.file-type-js,
i.file-preview.file-type-css,
i.file-preview.file-type-php,
i.file-preview.file-type-jsp,
i.file-preview.file-type-asp{
background-position: -700px center;
}
i.file-preview.file-type-apk{
background-position: -770px center;
}
i.file-preview.file-type-exe{
background-position: -840px center;
}
i.file-preview.file-type-ipa{
background-position: -910px center;
}
i.file-preview.file-type-mp4,
i.file-preview.file-type-swf,
i.file-preview.file-type-mkv,
i.file-preview.file-type-avi,
i.file-preview.file-type-flv,
i.file-preview.file-type-mov,
i.file-preview.file-type-mpg,
i.file-preview.file-type-mpeg,
i.file-preview.file-type-ogv,
i.file-preview.file-type-webm,
i.file-preview.file-type-rm,
i.file-preview.file-type-rmvb{
background-position: -980px center;
}
i.file-preview.file-type-ogg,
i.file-preview.file-type-wav,
i.file-preview.file-type-wmv,
i.file-preview.file-type-mid,
i.file-preview.file-type-mp3{
background-position: -1050px center;
}
i.file-preview.file-type-jpg,
i.file-preview.file-type-jpeg,
i.file-preview.file-type-gif,
i.file-preview.file-type-bmp,
i.file-preview.file-type-png,
i.file-preview.file-type-psd{
background-position: -140px center;
}

View File

@ -0,0 +1,60 @@
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>ueditor图片对话框</title>
<script type="text/javascript" src="../internal.js"></script>
<!-- jquery -->
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
<!-- webuploader -->
<script src="../../third-party/webuploader/webuploader.min.js"></script>
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
<!-- attachment dialog -->
<link rel="stylesheet" href="attachment.css" type="text/css" />
</head>
<body>
<div class="wrapper">
<div id="tabhead" class="tabhead">
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
</div>
<div id="tabbody" class="tabbody">
<!-- 上传图片 -->
<div id="upload" class="panel focus">
<div id="queueList" class="queueList">
<div class="statusBar element-invisible">
<div class="progress">
<span class="text">0%</span>
<span class="percentage"></span>
</div><div class="info"></div>
<div class="btns">
<div id="filePickerBtn"></div>
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
</div>
</div>
<div id="dndArea" class="placeholder">
<div class="filePickerContainer">
<div id="filePickerReady"></div>
</div>
</div>
<ul class="filelist element-invisible">
<li id="filePickerBlock" class="filePickerBlock"></li>
</ul>
</div>
</div>
<!-- 在线图片 -->
<div id="online" class="panel">
<div id="fileList"><var id="lang_imgLoading"></var></div>
</div>
</div>
</div>
<script type="text/javascript" src="attachment.js"></script>
</body>
</html>

View File

@ -0,0 +1,760 @@
/**
* User: Jinqn
* Date: 14-04-08
* Time: 下午16:34
* 上传图片对话框逻辑代码,包括tab: 远程图片/上传图片/在线图片/搜索图片
*/
(function () {
var uploadFile,
onlineFile;
window.onload = function () {
initTabs();
initButtons();
};
/* 初始化tab标签 */
function initTabs() {
var tabs = $G('tabhead').children;
for (var i = 0; i < tabs.length; i++) {
domUtils.on(tabs[i], "click", function (e) {
var target = e.target || e.srcElement;
setTabFocus(target.getAttribute('data-content-id'));
});
}
setTabFocus('upload');
}
/* 初始化tabbody */
function setTabFocus(id) {
if(!id) return;
var i, bodyId, tabs = $G('tabhead').children;
for (i = 0; i < tabs.length; i++) {
bodyId = tabs[i].getAttribute('data-content-id')
if (bodyId == id) {
domUtils.addClass(tabs[i], 'focus');
domUtils.addClass($G(bodyId), 'focus');
} else {
domUtils.removeClasses(tabs[i], 'focus');
domUtils.removeClasses($G(bodyId), 'focus');
}
}
switch (id) {
case 'upload':
uploadFile = uploadFile || new UploadFile('queueList');
break;
case 'online':
onlineFile = onlineFile || new OnlineFile('fileList');
break;
}
}
/* 初始化onok事件 */
function initButtons() {
dialog.onok = function () {
var list = [], id, tabs = $G('tabhead').children;
for (var i = 0; i < tabs.length; i++) {
if (domUtils.hasClass(tabs[i], 'focus')) {
id = tabs[i].getAttribute('data-content-id');
break;
}
}
switch (id) {
case 'upload':
list = uploadFile.getInsertList();
var count = uploadFile.getQueueCount();
if (count) {
$('.info', '#queueList').html('<span style="color:red;">' + '还有2个未上传文件'.replace(/[\d]/, count) + '</span>');
return false;
}
break;
case 'online':
list = onlineFile.getInsertList();
break;
}
editor.execCommand('insertfile', list);
};
}
/* 上传附件 */
function UploadFile(target) {
this.$wrap = target.constructor == String ? $('#' + target) : $(target);
this.init();
}
UploadFile.prototype = {
init: function () {
this.fileList = [];
this.initContainer();
this.initUploader();
},
initContainer: function () {
this.$queue = this.$wrap.find('.filelist');
},
/* 初始化容器 */
initUploader: function () {
var _this = this,
$ = jQuery, // just in case. Make sure it's not an other libaray.
$wrap = _this.$wrap,
// 图片容器
$queue = $wrap.find('.filelist'),
// 状态栏,包括进度和控制按钮
$statusBar = $wrap.find('.statusBar'),
// 文件总体选择信息。
$info = $statusBar.find('.info'),
// 上传按钮
$upload = $wrap.find('.uploadBtn'),
// 上传按钮
$filePickerBtn = $wrap.find('.filePickerBtn'),
// 上传按钮
$filePickerBlock = $wrap.find('.filePickerBlock'),
// 没选择文件之前的内容。
$placeHolder = $wrap.find('.placeholder'),
// 总体进度条
$progress = $statusBar.find('.progress').hide(),
// 添加的文件数量
fileCount = 0,
// 添加的文件总大小
fileSize = 0,
// 优化retina, 在retina下这个值是2
ratio = window.devicePixelRatio || 1,
// 缩略图大小
thumbnailWidth = 113 * ratio,
thumbnailHeight = 113 * ratio,
// 可能有pedding, ready, uploading, confirm, done.
state = '',
// 所有文件的进度信息key为file id
percentages = {},
supportTransition = (function () {
var s = document.createElement('p').style,
r = 'transition' in s ||
'WebkitTransition' in s ||
'MozTransition' in s ||
'msTransition' in s ||
'OTransition' in s;
s = null;
return r;
})(),
// WebUploader实例
uploader,
actionUrl = editor.getActionUrl(editor.getOpt('fileActionName')),
fileMaxSize = editor.getOpt('fileMaxSize'),
acceptExtensions = (editor.getOpt('fileAllowFiles') || []).join('').replace(/\./g, ',').replace(/^[,]/, '');;
if (!WebUploader.Uploader.support()) {
$('#filePickerReady').after($('<div>').html(lang.errorNotSupport)).hide();
return;
} else if (!editor.getOpt('fileActionName')) {
$('#filePickerReady').after($('<div>').html(lang.errorLoadConfig)).hide();
return;
}
uploader = _this.uploader = WebUploader.create({
pick: {
id: '#filePickerReady',
label: lang.uploadSelectFile
},
swf: '../../third-party/webuploader/Uploader.swf',
server: actionUrl,
fileVal: editor.getOpt('fileFieldName'),
duplicate: true,
fileSingleSizeLimit: fileMaxSize,
compress: false
});
uploader.addButton({
id: '#filePickerBlock'
});
uploader.addButton({
id: '#filePickerBtn',
label: lang.uploadAddFile
});
setState('pedding');
// 当有文件添加进来时执行负责view的创建
function addFile(file) {
var $li = $('<li id="' + file.id + '">' +
'<p class="title">' + file.name + '</p>' +
'<p class="imgWrap"></p>' +
'<p class="progress"><span></span></p>' +
'</li>'),
$btns = $('<div class="file-panel">' +
'<span class="cancel">' + lang.uploadDelete + '</span>' +
'<span class="rotateRight">' + lang.uploadTurnRight + '</span>' +
'<span class="rotateLeft">' + lang.uploadTurnLeft + '</span></div>').appendTo($li),
$prgress = $li.find('p.progress span'),
$wrap = $li.find('p.imgWrap'),
$info = $('<p class="error"></p>').hide().appendTo($li),
showError = function (code) {
switch (code) {
case 'exceed_size':
text = lang.errorExceedSize;
break;
case 'interrupt':
text = lang.errorInterrupt;
break;
case 'http':
text = lang.errorHttp;
break;
case 'not_allow_type':
text = lang.errorFileType;
break;
default:
text = lang.errorUploadRetry;
break;
}
$info.text(text).show();
};
if (file.getStatus() === 'invalid') {
showError(file.statusText);
} else {
$wrap.text(lang.uploadPreview);
if ('|png|jpg|jpeg|bmp|gif|'.indexOf('|'+file.ext.toLowerCase()+'|') == -1) {
$wrap.empty().addClass('notimage').append('<i class="file-preview file-type-' + file.ext.toLowerCase() + '"></i>' +
'<span class="file-title" title="' + file.name + '">' + file.name + '</span>');
} else {
if (browser.ie && browser.version <= 7) {
$wrap.text(lang.uploadNoPreview);
} else {
uploader.makeThumb(file, function (error, src) {
if (error || !src) {
$wrap.text(lang.uploadNoPreview);
} else {
var $img = $('<img src="' + src + '">');
$wrap.empty().append($img);
$img.on('error', function () {
$wrap.text(lang.uploadNoPreview);
});
}
}, thumbnailWidth, thumbnailHeight);
}
}
percentages[ file.id ] = [ file.size, 0 ];
file.rotation = 0;
/* 检查文件格式 */
if (!file.ext || acceptExtensions.indexOf(file.ext.toLowerCase()) == -1) {
showError('not_allow_type');
uploader.removeFile(file);
}
}
file.on('statuschange', function (cur, prev) {
if (prev === 'progress') {
$prgress.hide().width(0);
} else if (prev === 'queued') {
$li.off('mouseenter mouseleave');
$btns.remove();
}
// 成功
if (cur === 'error' || cur === 'invalid') {
showError(file.statusText);
percentages[ file.id ][ 1 ] = 1;
} else if (cur === 'interrupt') {
showError('interrupt');
} else if (cur === 'queued') {
percentages[ file.id ][ 1 ] = 0;
} else if (cur === 'progress') {
$info.hide();
$prgress.css('display', 'block');
} else if (cur === 'complete') {
}
$li.removeClass('state-' + prev).addClass('state-' + cur);
});
$li.on('mouseenter', function () {
$btns.stop().animate({height: 30});
});
$li.on('mouseleave', function () {
$btns.stop().animate({height: 0});
});
$btns.on('click', 'span', function () {
var index = $(this).index(),
deg;
switch (index) {
case 0:
uploader.removeFile(file);
return;
case 1:
file.rotation += 90;
break;
case 2:
file.rotation -= 90;
break;
}
if (supportTransition) {
deg = 'rotate(' + file.rotation + 'deg)';
$wrap.css({
'-webkit-transform': deg,
'-mos-transform': deg,
'-o-transform': deg,
'transform': deg
});
} else {
$wrap.css('filter', 'progid:DXImageTransform.Microsoft.BasicImage(rotation=' + (~~((file.rotation / 90) % 4 + 4) % 4) + ')');
}
});
$li.insertBefore($filePickerBlock);
}
// 负责view的销毁
function removeFile(file) {
var $li = $('#' + file.id);
delete percentages[ file.id ];
updateTotalProgress();
$li.off().find('.file-panel').off().end().remove();
}
function updateTotalProgress() {
var loaded = 0,
total = 0,
spans = $progress.children(),
percent;
$.each(percentages, function (k, v) {
total += v[ 0 ];
loaded += v[ 0 ] * v[ 1 ];
});
percent = total ? loaded / total : 0;
spans.eq(0).text(Math.round(percent * 100) + '%');
spans.eq(1).css('width', Math.round(percent * 100) + '%');
updateStatus();
}
function setState(val, files) {
if (val != state) {
var stats = uploader.getStats();
$upload.removeClass('state-' + state);
$upload.addClass('state-' + val);
switch (val) {
/* 未选择文件 */
case 'pedding':
$queue.addClass('element-invisible');
$statusBar.addClass('element-invisible');
$placeHolder.removeClass('element-invisible');
$progress.hide(); $info.hide();
uploader.refresh();
break;
/* 可以开始上传 */
case 'ready':
$placeHolder.addClass('element-invisible');
$queue.removeClass('element-invisible');
$statusBar.removeClass('element-invisible');
$progress.hide(); $info.show();
$upload.text(lang.uploadStart);
uploader.refresh();
break;
/* 上传中 */
case 'uploading':
$progress.show(); $info.hide();
$upload.text(lang.uploadPause);
break;
/* 暂停上传 */
case 'paused':
$progress.show(); $info.hide();
$upload.text(lang.uploadContinue);
break;
case 'confirm':
$progress.show(); $info.hide();
$upload.text(lang.uploadStart);
stats = uploader.getStats();
if (stats.successNum && !stats.uploadFailNum) {
setState('finish');
return;
}
break;
case 'finish':
$progress.hide(); $info.show();
if (stats.uploadFailNum) {
$upload.text(lang.uploadRetry);
} else {
$upload.text(lang.uploadStart);
}
break;
}
state = val;
updateStatus();
}
if (!_this.getQueueCount()) {
$upload.addClass('disabled')
} else {
$upload.removeClass('disabled')
}
}
function updateStatus() {
var text = '', stats;
if (state === 'ready') {
text = lang.updateStatusReady.replace('_', fileCount).replace('_KB', WebUploader.formatSize(fileSize));
} else if (state === 'confirm') {
stats = uploader.getStats();
if (stats.uploadFailNum) {
text = lang.updateStatusConfirm.replace('_', stats.successNum).replace('_', stats.successNum);
}
} else {
stats = uploader.getStats();
text = lang.updateStatusFinish.replace('_', fileCount).
replace('_KB', WebUploader.formatSize(fileSize)).
replace('_', stats.successNum);
if (stats.uploadFailNum) {
text += lang.updateStatusError.replace('_', stats.uploadFailNum);
}
}
$info.html(text);
}
uploader.on('fileQueued', function (file) {
fileCount++;
fileSize += file.size;
if (fileCount === 1) {
$placeHolder.addClass('element-invisible');
$statusBar.show();
}
addFile(file);
});
uploader.on('fileDequeued', function (file) {
fileCount--;
fileSize -= file.size;
removeFile(file);
updateTotalProgress();
});
uploader.on('filesQueued', function (file) {
if (!uploader.isInProgress() && (state == 'pedding' || state == 'finish' || state == 'confirm' || state == 'ready')) {
setState('ready');
}
updateTotalProgress();
});
uploader.on('all', function (type, files) {
switch (type) {
case 'uploadFinished':
setState('confirm', files);
break;
case 'startUpload':
/* 添加额外的GET参数 */
var params = utils.serializeParam(editor.queryCommandValue('serverparam')) || '',
url = utils.formatUrl(actionUrl + (actionUrl.indexOf('?') == -1 ? '?':'&') + 'encode=utf-8&' + params);
uploader.option('server', url);
setState('uploading', files);
break;
case 'stopUpload':
setState('paused', files);
break;
}
});
uploader.on('uploadBeforeSend', function (file, data, header) {
//这里可以通过data对象添加POST参数
header['X_Requested_With'] = 'XMLHttpRequest';
// HaoChuan9421
if(editor.options.headers && Object.prototype.toString.apply(editor.options.headers) === "[object Object]"){
for(var key in editor.options.headers){
header[key] = editor.options.headers[key]
}
}
});
uploader.on('uploadProgress', function (file, percentage) {
var $li = $('#' + file.id),
$percent = $li.find('.progress span');
$percent.css('width', percentage * 100 + '%');
percentages[ file.id ][ 1 ] = percentage;
updateTotalProgress();
});
uploader.on('uploadSuccess', function (file, ret) {
var $file = $('#' + file.id);
try {
var responseText = (ret._raw || ret),
json = utils.str2json(responseText);
if (json.state == 'SUCCESS') {
_this.fileList.push(json);
$file.append('<span class="success"></span>');
} else {
$file.find('.error').text(json.state).show();
}
} catch (e) {
$file.find('.error').text(lang.errorServerUpload).show();
}
});
uploader.on('uploadError', function (file, code) {
});
uploader.on('error', function (code, file) {
if (code == 'Q_TYPE_DENIED' || code == 'F_EXCEED_SIZE') {
addFile(file);
}
});
uploader.on('uploadComplete', function (file, ret) {
});
$upload.on('click', function () {
if ($(this).hasClass('disabled')) {
return false;
}
if (state === 'ready') {
uploader.upload();
} else if (state === 'paused') {
uploader.upload();
} else if (state === 'uploading') {
uploader.stop();
}
});
$upload.addClass('state-' + state);
updateTotalProgress();
},
getQueueCount: function () {
var file, i, status, readyFile = 0, files = this.uploader.getFiles();
for (i = 0; file = files[i++]; ) {
status = file.getStatus();
if (status == 'queued' || status == 'uploading' || status == 'progress') readyFile++;
}
return readyFile;
},
getInsertList: function () {
var i, link, data, list = [],
prefix = editor.getOpt('fileUrlPrefix');
for (i = 0; i < this.fileList.length; i++) {
data = this.fileList[i];
link = data.url;
list.push({
title: data.original || link.substr(link.lastIndexOf('/') + 1),
url: prefix + link
});
}
return list;
}
};
/* 在线附件 */
function OnlineFile(target) {
this.container = utils.isString(target) ? document.getElementById(target) : target;
this.init();
}
OnlineFile.prototype = {
init: function () {
this.initContainer();
this.initEvents();
this.initData();
},
/* 初始化容器 */
initContainer: function () {
this.container.innerHTML = '';
this.list = document.createElement('ul');
this.clearFloat = document.createElement('li');
domUtils.addClass(this.list, 'list');
domUtils.addClass(this.clearFloat, 'clearFloat');
this.list.appendChild(this.clearFloat);
this.container.appendChild(this.list);
},
/* 初始化滚动事件,滚动到地步自动拉取数据 */
initEvents: function () {
var _this = this;
/* 滚动拉取图片 */
domUtils.on($G('fileList'), 'scroll', function(e){
var panel = this;
if (panel.scrollHeight - (panel.offsetHeight + panel.scrollTop) < 10) {
_this.getFileData();
}
});
/* 选中图片 */
domUtils.on(this.list, 'click', function (e) {
var target = e.target || e.srcElement,
li = target.parentNode;
if (li.tagName.toLowerCase() == 'li') {
if (domUtils.hasClass(li, 'selected')) {
domUtils.removeClasses(li, 'selected');
} else {
domUtils.addClass(li, 'selected');
}
}
});
},
/* 初始化第一次的数据 */
initData: function () {
/* 拉取数据需要使用的值 */
this.state = 0;
this.listSize = editor.getOpt('fileManagerListSize');
this.listIndex = 0;
this.listEnd = false;
/* 第一次拉取数据 */
this.getFileData();
},
/* 向后台拉取图片列表数据 */
getFileData: function () {
var _this = this;
if(!_this.listEnd && !this.isLoadingData) {
this.isLoadingData = true;
ajax.request(editor.getActionUrl(editor.getOpt('fileManagerActionName')), {
timeout: 100000,
data: utils.extend({
start: this.listIndex,
size: this.listSize
}, editor.queryCommandValue('serverparam')),
method: 'get',
onsuccess: function (r) {
try {
var json = eval('(' + r.responseText + ')');
if (json.state == 'SUCCESS') {
_this.pushData(json.list);
_this.listIndex = parseInt(json.start) + parseInt(json.list.length);
if(_this.listIndex >= json.total) {
_this.listEnd = true;
}
_this.isLoadingData = false;
}
} catch (e) {
if(r.responseText.indexOf('ue_separate_ue') != -1) {
var list = r.responseText.split(r.responseText);
_this.pushData(list);
_this.listIndex = parseInt(list.length);
_this.listEnd = true;
_this.isLoadingData = false;
}
}
},
onerror: function () {
_this.isLoadingData = false;
}
});
}
},
/* 添加图片到列表界面上 */
pushData: function (list) {
var i, item, img, filetype, preview, icon, _this = this,
urlPrefix = editor.getOpt('fileManagerUrlPrefix');
for (i = 0; i < list.length; i++) {
if(list[i] && list[i].url) {
item = document.createElement('li');
icon = document.createElement('span');
filetype = list[i].url.substr(list[i].url.lastIndexOf('.') + 1);
if ( "png|jpg|jpeg|gif|bmp".indexOf(filetype) != -1 ) {
preview = document.createElement('img');
domUtils.on(preview, 'load', (function(image){
return function(){
_this.scale(image, image.parentNode.offsetWidth, image.parentNode.offsetHeight);
};
})(preview));
preview.width = 113;
preview.setAttribute('src', urlPrefix + list[i].url + (list[i].url.indexOf('?') == -1 ? '?noCache=':'&noCache=') + (+new Date()).toString(36) );
} else {
var ic = document.createElement('i'),
textSpan = document.createElement('span');
textSpan.innerHTML = list[i].url.substr(list[i].url.lastIndexOf('/') + 1);
preview = document.createElement('div');
preview.appendChild(ic);
preview.appendChild(textSpan);
domUtils.addClass(preview, 'file-wrapper');
domUtils.addClass(textSpan, 'file-title');
domUtils.addClass(ic, 'file-type-' + filetype);
domUtils.addClass(ic, 'file-preview');
}
domUtils.addClass(icon, 'icon');
item.setAttribute('data-url', urlPrefix + list[i].url);
if (list[i].original) {
item.setAttribute('data-title', list[i].original);
}
item.appendChild(preview);
item.appendChild(icon);
this.list.insertBefore(item, this.clearFloat);
}
}
},
/* 改变图片大小 */
scale: function (img, w, h, type) {
var ow = img.width,
oh = img.height;
if (type == 'justify') {
if (ow >= oh) {
img.width = w;
img.height = h * oh / ow;
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
} else {
img.width = w * ow / oh;
img.height = h;
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
}
} else {
if (ow >= oh) {
img.width = w * ow / oh;
img.height = h;
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
} else {
img.width = w;
img.height = h * oh / ow;
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
}
}
},
getInsertList: function () {
var i, lis = this.list.children, list = [];
for (i = 0; i < lis.length; i++) {
if (domUtils.hasClass(lis[i], 'selected')) {
var url = lis[i].getAttribute('data-url');
var title = lis[i].getAttribute('data-title') || url.substr(url.lastIndexOf('/') + 1);
list.push({
title: title,
url: url
});
}
}
return list;
}
};
})();

Binary file not shown.

After

Width:  |  Height:  |  Size: 923 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 841 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1012 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 949 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 950 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 986 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1001 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 996 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1001 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1009 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1007 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 970 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1005 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 453 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 445 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,95 @@
.wrapper{ width: 424px;margin: 10px auto; zoom:1;position: relative}
.tabbody{height:225px;}
.tabbody .panel { position: absolute;width:100%; height:100%;background: #fff; display: none;}
.tabbody .focus { display: block;}
body{font-size: 12px;color: #888;}
/*overflow: hidden;}*/
input,label{vertical-align:middle}
.clear{clear: both;}
.pl{padding-left: 18px;padding-left: 23px\9;}
#imageList {width: 420px;height: 215px;margin-top: 10px;overflow: hidden;overflow-y: auto;}
#imageList div {float: left;width: 100px;height: 95px;margin: 5px 10px;}
#imageList img {cursor: pointer;border: 2px solid white;}
.bgarea{margin: 10px;padding: 5px;height: 84%;border: 1px solid #A8A297;}
.content div{margin: 10px 0 10px 5px;}
.content .iptradio{margin: 0px 5px 5px 0px;}
.txt{width:280px;}
.wrapcolor{height: 19px;}
div.color{float: left;margin: 0;}
#colorPicker{width: 17px;height: 17px;border: 1px solid #CCC;display: inline-block;border-radius: 3px;box-shadow: 2px 2px 5px #D3D6DA;margin: 0;float: left;}
div.alignment,#custom{margin-left: 23px;margin-left: 28px\9;}
#custom input{height: 15px;min-height: 15px;width:20px;}
#repeatType{width:100px;}
/* 图片管理样式 */
#imgManager {
width: 100%;
height: 225px;
}
#imgManager #imageList{
width: 100%;
overflow-x: hidden;
overflow-y: auto;
}
#imgManager ul {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
#imgManager li {
float: left;
display: block;
list-style: none;
padding: 0;
width: 113px;
height: 113px;
margin: 9px 0 0 19px;
background-color: #eee;
overflow: hidden;
cursor: pointer;
position: relative;
}
#imgManager li.clearFloat {
float: none;
clear: both;
display: block;
width:0;
height:0;
margin: 0;
padding: 0;
}
#imgManager li img {
cursor: pointer;
}
#imgManager li .icon {
cursor: pointer;
width: 113px;
height: 113px;
position: absolute;
top: 0;
left: 0;
z-index: 2;
border: 0;
background-repeat: no-repeat;
}
#imgManager li .icon:hover {
width: 107px;
height: 107px;
border: 3px solid #1094fa;
}
#imgManager li.selected .icon {
background-image: url(images/success.png);
background-position: 75px 75px;
}
#imgManager li.selected .icon:hover {
width: 107px;
height: 107px;
border: 3px solid #1094fa;
background-position: 72px 72px;
}

View File

@ -0,0 +1,56 @@
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="../internal.js"></script>
<link rel="stylesheet" type="text/css" href="background.css">
</head>
<body>
<div id="bg_container" class="wrapper">
<div id="tabHeads" class="tabhead">
<span class="focus" data-content-id="normal"><var id="lang_background_normal"></var></span>
<span class="" data-content-id="imgManager"><var id="lang_background_local"></var></span>
</div>
<div id="tabBodys" class="tabbody">
<div id="normal" class="panel focus">
<fieldset class="bgarea">
<legend><var id="lang_background_set"></var></legend>
<div class="content">
<div>
<label><input id="nocolorRadio" class="iptradio" type="radio" name="t" value="none" checked="checked"><var id="lang_background_none"></var></label>
<label><input id="coloredRadio" class="iptradio" type="radio" name="t" value="color"><var id="lang_background_colored"></var></label>
</div>
<div class="wrapcolor pl">
<div class="color">
<var id="lang_background_color"></var>:
</div>
<div id="colorPicker"></div>
<div class="clear"></div>
</div>
<div class="wrapcolor pl">
<label><var id="lang_background_netimg"></var>:</label><input class="txt" type="text" id="url">
</div>
<div id="alignment" class="alignment">
<var id="lang_background_align"></var>:<select id="repeatType">
<option value="center"></option>
<option value="repeat-x"></option>
<option value="repeat-y"></option>
<option value="repeat"></option>
<option value="self"></option>
</select>
</div>
<div id="custom" >
<var id="lang_background_position"></var>:x:<input type="text" size="1" id="x" maxlength="4" value="0">px&nbsp;&nbsp;y:<input type="text" size="1" id="y" maxlength="4" value="0">px
</div>
</div>
</fieldset>
</div>
<div id="imgManager" class="panel">
<div id="imageList" style=""></div>
</div>
</div>
</div>
<script type="text/javascript" src="background.js"></script>
</body>
</html>

View File

@ -0,0 +1,376 @@
(function () {
var onlineImage,
backupStyle = editor.queryCommandValue('background');
window.onload = function () {
initTabs();
initColorSelector();
};
/* 初始化tab标签 */
function initTabs(){
var tabs = $G('tabHeads').children;
for (var i = 0; i < tabs.length; i++) {
domUtils.on(tabs[i], "click", function (e) {
var target = e.target || e.srcElement;
for (var j = 0; j < tabs.length; j++) {
if(tabs[j] == target){
tabs[j].className = "focus";
var contentId = tabs[j].getAttribute('data-content-id');
$G(contentId).style.display = "block";
if(contentId == 'imgManager') {
initImagePanel();
}
}else {
tabs[j].className = "";
$G(tabs[j].getAttribute('data-content-id')).style.display = "none";
}
}
});
}
}
/* 初始化颜色设置 */
function initColorSelector () {
var obj = editor.queryCommandValue('background');
if (obj) {
var color = obj['background-color'],
repeat = obj['background-repeat'] || 'repeat',
image = obj['background-image'] || '',
position = obj['background-position'] || 'center center',
pos = position.split(' '),
x = parseInt(pos[0]) || 0,
y = parseInt(pos[1]) || 0;
if(repeat == 'no-repeat' && (x || y)) repeat = 'self';
image = image.match(/url[\s]*\(([^\)]*)\)/);
image = image ? image[1]:'';
updateFormState('colored', color, image, repeat, x, y);
} else {
updateFormState();
}
var updateHandler = function () {
updateFormState();
updateBackground();
}
domUtils.on($G('nocolorRadio'), 'click', updateBackground);
domUtils.on($G('coloredRadio'), 'click', updateHandler);
domUtils.on($G('url'), 'keyup', function(){
if($G('url').value && $G('alignment').style.display == "none") {
utils.each($G('repeatType').children, function(item){
item.selected = ('repeat' == item.getAttribute('value') ? 'selected':false);
});
}
updateHandler();
});
domUtils.on($G('repeatType'), 'change', updateHandler);
domUtils.on($G('x'), 'keyup', updateBackground);
domUtils.on($G('y'), 'keyup', updateBackground);
initColorPicker();
}
/* 初始化颜色选择器 */
function initColorPicker() {
var me = editor,
cp = $G("colorPicker");
/* 生成颜色选择器ui对象 */
var popup = new UE.ui.Popup({
content: new UE.ui.ColorPicker({
noColorText: me.getLang("clearColor"),
editor: me,
onpickcolor: function (t, color) {
updateFormState('colored', color);
updateBackground();
UE.ui.Popup.postHide();
},
onpicknocolor: function (t, color) {
updateFormState('colored', 'transparent');
updateBackground();
UE.ui.Popup.postHide();
}
}),
editor: me,
onhide: function () {
}
});
/* 设置颜色选择器 */
domUtils.on(cp, "click", function () {
popup.showAnchor(this);
});
domUtils.on(document, 'mousedown', function (evt) {
var el = evt.target || evt.srcElement;
UE.ui.Popup.postHide(el);
});
domUtils.on(window, 'scroll', function () {
UE.ui.Popup.postHide();
});
}
/* 初始化在线图片列表 */
function initImagePanel() {
onlineImage = onlineImage || new OnlineImage('imageList');
}
/* 更新背景色设置面板 */
function updateFormState (radio, color, url, align, x, y) {
var nocolorRadio = $G('nocolorRadio'),
coloredRadio = $G('coloredRadio');
if(radio) {
nocolorRadio.checked = (radio == 'colored' ? false:'checked');
coloredRadio.checked = (radio == 'colored' ? 'checked':false);
}
if(color) {
domUtils.setStyle($G("colorPicker"), "background-color", color);
}
if(url && /^\//.test(url)) {
var a = document.createElement('a');
a.href = url;
browser.ie && (a.href = a.href);
url = browser.ie ? a.href:(a.protocol + '//' + a.host + a.pathname + a.search + a.hash);
}
if(url || url === '') {
$G('url').value = url;
}
if(align) {
utils.each($G('repeatType').children, function(item){
item.selected = (align == item.getAttribute('value') ? 'selected':false);
});
}
if(x || y) {
$G('x').value = parseInt(x) || 0;
$G('y').value = parseInt(y) || 0;
}
$G('alignment').style.display = coloredRadio.checked && $G('url').value ? '':'none';
$G('custom').style.display = coloredRadio.checked && $G('url').value && $G('repeatType').value == 'self' ? '':'none';
}
/* 更新背景颜色 */
function updateBackground () {
if ($G('coloredRadio').checked) {
var color = domUtils.getStyle($G("colorPicker"), "background-color"),
bgimg = $G("url").value,
align = $G("repeatType").value,
backgroundObj = {
"background-repeat": "no-repeat",
"background-position": "center center"
};
if (color) backgroundObj["background-color"] = color;
if (bgimg) backgroundObj["background-image"] = 'url(' + bgimg + ')';
if (align == 'self') {
backgroundObj["background-position"] = $G("x").value + "px " + $G("y").value + "px";
} else if (align == 'repeat-x' || align == 'repeat-y' || align == 'repeat') {
backgroundObj["background-repeat"] = align;
}
editor.execCommand('background', backgroundObj);
} else {
editor.execCommand('background', null);
}
}
/* 在线图片 */
function OnlineImage(target) {
this.container = utils.isString(target) ? document.getElementById(target) : target;
this.init();
}
OnlineImage.prototype = {
init: function () {
this.reset();
this.initEvents();
},
/* 初始化容器 */
initContainer: function () {
this.container.innerHTML = '';
this.list = document.createElement('ul');
this.clearFloat = document.createElement('li');
domUtils.addClass(this.list, 'list');
domUtils.addClass(this.clearFloat, 'clearFloat');
this.list.id = 'imageListUl';
this.list.appendChild(this.clearFloat);
this.container.appendChild(this.list);
},
/* 初始化滚动事件,滚动到地步自动拉取数据 */
initEvents: function () {
var _this = this;
/* 滚动拉取图片 */
domUtils.on($G('imageList'), 'scroll', function(e){
var panel = this;
if (panel.scrollHeight - (panel.offsetHeight + panel.scrollTop) < 10) {
_this.getImageData();
}
});
/* 选中图片 */
domUtils.on(this.container, 'click', function (e) {
var target = e.target || e.srcElement,
li = target.parentNode,
nodes = $G('imageListUl').childNodes;
if (li.tagName.toLowerCase() == 'li') {
updateFormState('nocolor', null, '');
for (var i = 0, node; node = nodes[i++];) {
if (node == li && !domUtils.hasClass(node, 'selected')) {
domUtils.addClass(node, 'selected');
updateFormState('colored', null, li.firstChild.getAttribute("_src"), 'repeat');
} else {
domUtils.removeClasses(node, 'selected');
}
}
updateBackground();
}
});
},
/* 初始化第一次的数据 */
initData: function () {
/* 拉取数据需要使用的值 */
this.state = 0;
this.listSize = editor.getOpt('imageManagerListSize');
this.listIndex = 0;
this.listEnd = false;
/* 第一次拉取数据 */
this.getImageData();
},
/* 重置界面 */
reset: function() {
this.initContainer();
this.initData();
},
/* 向后台拉取图片列表数据 */
getImageData: function () {
var _this = this;
if(!_this.listEnd && !this.isLoadingData) {
this.isLoadingData = true;
var url = editor.getActionUrl(editor.getOpt('imageManagerActionName')),
isJsonp = utils.isCrossDomainUrl(url);
ajax.request(url, {
'timeout': 100000,
'dataType': isJsonp ? 'jsonp':'',
'data': utils.extend({
start: this.listIndex,
size: this.listSize
}, editor.queryCommandValue('serverparam')),
'method': 'get',
'onsuccess': function (r) {
try {
var json = isJsonp ? r:eval('(' + r.responseText + ')');
if (json.state == 'SUCCESS') {
_this.pushData(json.list);
_this.listIndex = parseInt(json.start) + parseInt(json.list.length);
if(_this.listIndex >= json.total) {
_this.listEnd = true;
}
_this.isLoadingData = false;
}
} catch (e) {
if(r.responseText.indexOf('ue_separate_ue') != -1) {
var list = r.responseText.split(r.responseText);
_this.pushData(list);
_this.listIndex = parseInt(list.length);
_this.listEnd = true;
_this.isLoadingData = false;
}
}
},
'onerror': function () {
_this.isLoadingData = false;
}
});
}
},
/* 添加图片到列表界面上 */
pushData: function (list) {
var i, item, img, icon, _this = this,
urlPrefix = editor.getOpt('imageManagerUrlPrefix');
for (i = 0; i < list.length; i++) {
if(list[i] && list[i].url) {
item = document.createElement('li');
img = document.createElement('img');
icon = document.createElement('span');
domUtils.on(img, 'load', (function(image){
return function(){
_this.scale(image, image.parentNode.offsetWidth, image.parentNode.offsetHeight);
}
})(img));
img.width = 113;
img.setAttribute('src', urlPrefix + list[i].url + (list[i].url.indexOf('?') == -1 ? '?noCache=':'&noCache=') + (+new Date()).toString(36) );
img.setAttribute('_src', urlPrefix + list[i].url);
domUtils.addClass(icon, 'icon');
item.appendChild(img);
item.appendChild(icon);
this.list.insertBefore(item, this.clearFloat);
}
}
},
/* 改变图片大小 */
scale: function (img, w, h, type) {
var ow = img.width,
oh = img.height;
if (type == 'justify') {
if (ow >= oh) {
img.width = w;
img.height = h * oh / ow;
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
} else {
img.width = w * ow / oh;
img.height = h;
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
}
} else {
if (ow >= oh) {
img.width = w * ow / oh;
img.height = h;
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
} else {
img.width = w;
img.height = h * oh / ow;
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
}
}
},
getInsertList: function () {
var i, lis = this.list.children, list = [], align = getAlign();
for (i = 0; i < lis.length; i++) {
if (domUtils.hasClass(lis[i], 'selected')) {
var img = lis[i].firstChild,
src = img.getAttribute('_src');
list.push({
src: src,
_src: src,
floatStyle: align
});
}
}
return list;
}
};
dialog.onok = function () {
updateBackground();
editor.fireEvent('saveScene');
};
dialog.oncancel = function () {
editor.execCommand('background', backupStyle);
};
})();

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,65 @@
/*
* 图表配置文件
* */
//不同类型的配置
var typeConfig = [
{
chart: {
type: 'line'
},
plotOptions: {
line: {
dataLabels: {
enabled: false
},
enableMouseTracking: true
}
}
}, {
chart: {
type: 'line'
},
plotOptions: {
line: {
dataLabels: {
enabled: true
},
enableMouseTracking: false
}
}
}, {
chart: {
type: 'area'
}
}, {
chart: {
type: 'bar'
}
}, {
chart: {
type: 'column'
}
}, {
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ ( Math.round( this.point.percentage*100 ) / 100 ) +' %';
}
}
}
}
}
];

View File

@ -0,0 +1,165 @@
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow-x: hidden;
}
.main {
width: 100%;
overflow: hidden;
}
.table-view {
height: 100%;
float: left;
margin: 20px;
width: 40%;
}
.table-view .table-container {
width: 100%;
margin-bottom: 50px;
overflow: scroll;
}
.table-view th {
padding: 5px 10px;
background-color: #F7F7F7;
}
.table-view td {
width: 50px;
text-align: center;
padding:0;
}
.table-container input {
width: 40px;
padding: 5px;
border: none;
outline: none;
}
.table-view caption {
font-size: 18px;
text-align: left;
}
.charts-view {
/*margin-left: 49%!important;*/
width: 50%;
margin-left: 49%;
height: 400px;
}
.charts-container {
border-left: 1px solid #c3c3c3;
}
.charts-format fieldset {
padding-left: 20px;
margin-bottom: 50px;
}
.charts-format legend {
padding-left: 10px;
padding-right: 10px;
}
.format-item-container {
padding: 20px;
}
.format-item-container label {
display: block;
margin: 10px 0;
}
.charts-format .data-item {
border: 1px solid black;
outline: none;
padding: 2px 3px;
}
/* 图表类型 */
.charts-type {
margin-top: 50px;
height: 300px;
}
.scroll-view {
border: 1px solid #c3c3c3;
border-left: none;
border-right: none;
overflow: hidden;
}
.scroll-container {
margin: 20px;
width: 100%;
overflow: hidden;
}
.scroll-bed {
width: 10000px;
_margin-top: 20px;
-webkit-transition: margin-left .5s ease;
-moz-transition: margin-left .5s ease;
transition: margin-left .5s ease;
}
.view-box {
display: inline-block;
*display: inline;
*zoom: 1;
margin-right: 20px;
border: 2px solid white;
line-height: 0;
overflow: hidden;
cursor: pointer;
}
.view-box img {
border: 1px solid #cecece;
}
.view-box.selected {
border-color: #7274A7;
}
.button-container {
margin-bottom: 20px;
text-align: center;
}
.button-container a {
display: inline-block;
width: 100px;
height: 25px;
line-height: 25px;
border: 1px solid #c2ccd1;
margin-right: 30px;
text-decoration: none;
color: black;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.button-container a:HOVER {
background: #fcfcfc;
}
.button-container a:ACTIVE {
border-top-color: #c2ccd1;
box-shadow:inset 0 5px 4px -4px rgba(49, 49, 64, 0.1);
}
.edui-charts-not-data {
height: 100px;
line-height: 100px;
text-align: center;
}

View File

@ -0,0 +1,89 @@
<!DOCTYPE html>
<html>
<head>
<title>chart</title>
<meta chartset="utf-8">
<link rel="stylesheet" type="text/css" href="charts.css">
<script type="text/javascript" src="../internal.js"></script>
</head>
<body>
<div class="main">
<div class="table-view">
<h3><var id="lang_data_source"></var></h3>
<div id="tableContainer" class="table-container"></div>
<h3><var id="lang_chart_format"></var></h3>
<form name="data-form">
<div class="charts-format">
<fieldset>
<legend><var id="lang_data_align"></var></legend>
<div class="format-item-container">
<label>
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="1" checked="checked">
<var id="lang_chart_align_same"></var>
</label>
<label>
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="-1">
<var id="lang_chart_align_reverse"></var>
</label>
<br>
</div>
</fieldset>
<fieldset>
<legend><var id="lang_chart_title"></var></legend>
<div class="format-item-container">
<label>
<var id="lang_chart_main_title"></var><input type="text" name="title" class="data-item">
</label>
<label>
<var id="lang_chart_sub_title"></var><input type="text" name="sub-title" class="data-item not-pie-item">
</label>
<label>
<var id="lang_chart_x_title"></var><input type="text" name="x-title" class="data-item not-pie-item">
</label>
<label>
<var id="lang_chart_y_title"></var><input type="text" name="y-title" class="data-item not-pie-item">
</label>
</div>
</fieldset>
<fieldset>
<legend><var id="lang_chart_tip"></var></legend>
<div class="format-item-container">
<label>
<var id="lang_cahrt_tip_prefix"></var>
<input type="text" id="tipInput" name="tip" class="data-item" disabled="disabled">
</label>
<p><var id="lang_cahrt_tip_description"></var></p>
</div>
</fieldset>
<fieldset>
<legend><var id="lang_chart_data_unit"></var></legend>
<div class="format-item-container">
<label><var id="lang_chart_data_unit_title"></var><input type="text" name="unit" class="data-item"></label>
<p><var id="lang_chart_data_unit_description"></var></p>
</div>
</fieldset>
</div>
</form>
</div>
<div class="charts-view">
<div id="chartsContainer" class="charts-container"></div>
<div id="chartsType" class="charts-type">
<h3><var id="lang_chart_type"></var></h3>
<div class="scroll-view">
<div class="scroll-container">
<div id="scrollBed" class="scroll-bed"></div>
</div>
<div id="buttonContainer" class="button-container">
<a href="#" data-title="prev"><var id="lang_prev_btn"></var></a>
<a href="#" data-title="next"><var id="lang_next_btn"></var></a>
</div>
</div>
</div>
</div>
</div>
<script src="../../third-party/jquery-1.10.2.min.js"></script>
<script src="../../third-party/highcharts/highcharts.js"></script>
<script src="chart.config.js"></script>
<script src="charts.js"></script>
</body>
</html>

View File

@ -0,0 +1,519 @@
/*
* 图片转换对话框脚本
**/
var tableData = [],
//编辑器页面table
editorTable = null,
chartsConfig = window.typeConfig,
resizeTimer = null,
//初始默认图表类型
currentChartType = 0;
window.onload = function () {
editorTable = domUtils.findParentByTagName( editor.selection.getRange().startContainer, 'table', true);
//未找到表格, 显示错误页面
if ( !editorTable ) {
document.body.innerHTML = "<div class='edui-charts-not-data'>未找到数据</div>";
return;
}
//初始化图表类型选择
initChartsTypeView();
renderTable( editorTable );
initEvent();
initUserConfig( editorTable.getAttribute( "data-chart" ) );
$( "#scrollBed .view-box:eq("+ currentChartType +")" ).trigger( "click" );
updateViewType( currentChartType );
dialog.addListener( "resize", function () {
if ( resizeTimer != null ) {
window.clearTimeout( resizeTimer );
}
resizeTimer = window.setTimeout( function () {
resizeTimer = null;
renderCharts();
}, 500 );
} );
};
function initChartsTypeView () {
var contents = [];
for ( var i = 0, len = chartsConfig.length; i<len; i++ ) {
contents.push( '<div class="view-box" data-chart-type="'+ i +'"><img width="300" src="images/charts'+ i +'.png"></div>' );
}
$( "#scrollBed" ).html( contents.join( "" ) );
}
//渲染table 以便用户修改数据
function renderTable ( table ) {
var tableHtml = [];
//构造数据
for ( var i = 0, row; row = table.rows[ i ]; i++ ) {
tableData[ i ] = [];
tableHtml[ i ] = [];
for ( var j = 0, cell; cell = row.cells[ j ]; j++ ) {
var value = getCellValue( cell );
if ( i > 0 && j > 0 ) {
value = +value;
}
if ( i === 0 || j === 0 ) {
tableHtml[ i ].push( '<th>'+ value +'</th>' );
} else {
tableHtml[ i ].push( '<td><input type="text" class="data-item" value="'+ value +'"></td>' );
}
tableData[ i ][ j ] = value;
}
tableHtml[ i ] = tableHtml[ i ].join( "" );
}
//draw 表格
$( "#tableContainer" ).html( '<table id="showTable" border="1"><tbody><tr>'+ tableHtml.join( "</tr><tr>" ) +'</tr></tbody></table>' );
}
/*
* 根据表格已有的图表属性初始化当前图表属性
*/
function initUserConfig ( config ) {
var parsedConfig = {};
if ( !config ) {
return;
}
config = config.split( ";" );
$.each( config, function ( index, item ) {
item = item.split( ":" );
parsedConfig[ item[ 0 ] ] = item[ 1 ];
} );
setUserConfig( parsedConfig );
}
function initEvent () {
var cacheValue = null,
//图表类型数
typeViewCount = chartsConfig.length- 1,
$chartsTypeViewBox = $( '#scrollBed .view-box' );
$( ".charts-format" ).delegate( ".format-ctrl", "change", function () {
renderCharts();
} )
$( ".table-view" ).delegate( ".data-item", "focus", function () {
cacheValue = this.value;
} ).delegate( ".data-item", "blur", function () {
if ( this.value !== cacheValue ) {
renderCharts();
}
cacheValue = null;
} );
$( "#buttonContainer" ).delegate( "a", "click", function (e) {
e.preventDefault();
if ( this.getAttribute( "data-title" ) === 'prev' ) {
if ( currentChartType > 0 ) {
currentChartType--;
updateViewType( currentChartType );
}
} else {
if ( currentChartType < typeViewCount ) {
currentChartType++;
updateViewType( currentChartType );
}
}
} );
//图表类型变化
$( '#scrollBed' ).delegate( ".view-box", "click", function (e) {
var index = $( this ).attr( "data-chart-type" );
$chartsTypeViewBox.removeClass( "selected" );
$( $chartsTypeViewBox[ index ] ).addClass( "selected" );
currentChartType = index | 0;
//饼图, 禁用部分配置
if ( currentChartType === chartsConfig.length - 1 ) {
disableNotPieConfig();
//启用完整配置
} else {
enableNotPieConfig();
}
renderCharts();
} );
}
function renderCharts () {
var data = collectData();
$('#chartsContainer').highcharts( $.extend( {}, chartsConfig[ currentChartType ], {
credits: {
enabled: false
},
exporting: {
enabled: false
},
title: {
text: data.title,
x: -20 //center
},
subtitle: {
text: data.subTitle,
x: -20
},
xAxis: {
title: {
text: data.xTitle
},
categories: data.categories
},
yAxis: {
title: {
text: data.yTitle
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
enabled: true,
valueSuffix: data.suffix
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 1
},
series: data.series
} ));
}
function updateViewType ( index ) {
$( "#scrollBed" ).css( 'marginLeft', -index*324+'px' );
}
function collectData () {
var form = document.forms[ 'data-form' ],
data = null;
if ( currentChartType !== chartsConfig.length - 1 ) {
data = getSeriesAndCategories();
$.extend( data, getUserConfig() );
//饼图数据格式
} else {
data = getSeriesForPieChart();
data.title = form[ 'title' ].value;
data.suffix = form[ 'unit' ].value;
}
return data;
}
/**
* 获取用户配置信息
*/
function getUserConfig () {
var form = document.forms[ 'data-form' ],
info = {
title: form[ 'title' ].value,
subTitle: form[ 'sub-title' ].value,
xTitle: form[ 'x-title' ].value,
yTitle: form[ 'y-title' ].value,
suffix: form[ 'unit' ].value,
//数据对齐方式
tableDataFormat: getTableDataFormat (),
//饼图提示文字
tip: $( "#tipInput" ).val()
};
return info;
}
function setUserConfig ( config ) {
var form = document.forms[ 'data-form' ];
config.title && ( form[ 'title' ].value = config.title );
config.subTitle && ( form[ 'sub-title' ].value = config.subTitle );
config.xTitle && ( form[ 'x-title' ].value = config.xTitle );
config.yTitle && ( form[ 'y-title' ].value = config.yTitle );
config.suffix && ( form[ 'unit' ].value = config.suffix );
config.dataFormat == "-1" && ( form[ 'charts-format' ][ 1 ].checked = true );
config.tip && ( form[ 'tip' ].value = config.tip );
currentChartType = config.chartType || 0;
}
function getSeriesAndCategories () {
var form = document.forms[ 'data-form' ],
series = [],
categories = [],
tmp = [],
tableData = getTableData();
//反转数据
if ( getTableDataFormat() === "-1" ) {
for ( var i = 0, len = tableData.length; i < len; i++ ) {
for ( var j = 0, jlen = tableData[ i ].length; j < jlen; j++ ) {
if ( !tmp[ j ] ) {
tmp[ j ] = [];
}
tmp[ j ][ i ] = tableData[ i ][ j ];
}
}
tableData = tmp;
}
categories = tableData[0].slice( 1 );
for ( var i = 1, data; data = tableData[ i ]; i++ ) {
series.push( {
name: data[ 0 ],
data: data.slice( 1 )
} );
}
return {
series: series,
categories: categories
};
}
/*
* 获取数据源数据对齐方式
*/
function getTableDataFormat () {
var form = document.forms[ 'data-form' ],
items = form['charts-format'];
return items[ 0 ].checked ? items[ 0 ].value : items[ 1 ].value;
}
/*
* 禁用非饼图类型的配置项
*/
function disableNotPieConfig() {
updateConfigItem( 'disable' );
}
/*
* 启用非饼图类型的配置项
*/
function enableNotPieConfig() {
updateConfigItem( 'enable' );
}
function updateConfigItem ( value ) {
var table = $( "#showTable" )[ 0 ],
isDisable = value === 'disable' ? true : false;
//table中的input处理
for ( var i = 2 , row; row = table.rows[ i ]; i++ ) {
for ( var j = 1, cell; cell = row.cells[ j ]; j++ ) {
$( "input", cell ).attr( "disabled", isDisable );
}
}
//其他项处理
$( "input.not-pie-item" ).attr( "disabled", isDisable );
$( "#tipInput" ).attr( "disabled", !isDisable )
}
/*
* 获取饼图数据
* 饼图的数据只取第一行的
**/
function getSeriesForPieChart () {
var series = {
type: 'pie',
name: $("#tipInput").val(),
data: []
},
tableData = getTableData();
for ( var j = 1, jlen = tableData[ 0 ].length; j < jlen; j++ ) {
var title = tableData[ 0 ][ j ],
val = tableData[ 1 ][ j ];
series.data.push( [ title, val ] );
}
return {
series: [ series ]
};
}
function getTableData () {
var table = document.getElementById( "showTable" ),
xCount = table.rows[0].cells.length - 1,
values = getTableInputValue();
for ( var i = 0, value; value = values[ i ]; i++ ) {
tableData[ Math.floor( i / xCount ) + 1 ][ i % xCount + 1 ] = values[ i ];
}
return tableData;
}
function getTableInputValue () {
var table = document.getElementById( "showTable" ),
inputs = table.getElementsByTagName( "input" ),
values = [];
for ( var i = 0, input; input = inputs[ i ]; i++ ) {
values.push( input.value | 0 );
}
return values;
}
function getCellValue ( cell ) {
var value = utils.trim( ( cell.innerText || cell.textContent || '' ) );
return value.replace( new RegExp( UE.dom.domUtils.fillChar, 'g' ), '' ).replace( /^\s+|\s+$/g, '' );
}
//dialog确认事件
dialog.onok = function () {
//收集信息
var form = document.forms[ 'data-form' ],
info = getUserConfig();
//添加图表类型
info.chartType = currentChartType;
//同步表格数据到编辑器
syncTableData();
//执行图表命令
editor.execCommand( 'charts', info );
};
/*
* 同步图表编辑视图的表格数据到编辑器里的原始表格
*/
function syncTableData () {
var tableData = getTableData();
for ( var i = 1, row; row = editorTable.rows[ i ]; i++ ) {
for ( var j = 1, cell; cell = row.cells[ j ]; j++ ) {
cell.innerHTML = tableData[ i ] [ j ];
}
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

View File

@ -0,0 +1,43 @@
.jd img{
background:transparent url(images/jxface2.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.pp img{
background:transparent url(images/fface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:25px;height:25px;display:block;
}
.ldw img{
background:transparent url(images/wface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.tsj img{
background:transparent url(images/tface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.cat img{
background:transparent url(images/cface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.bb img{
background:transparent url(images/bface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.youa img{
background:transparent url(images/yface.gif?v=1.1) no-repeat scroll left top;
cursor:pointer;width:35px;height:35px;display:block;
}
.smileytable td {height: 37px;}
#tabPanel{margin-left:5px;overflow: hidden;}
#tabContent {float:left;background:#FFFFFF;}
#tabContent div{display: none;width:480px;overflow:hidden;}
#tabIconReview.show{left:17px;display:block;}
.menuFocus{background:#ACCD3C;}
.menuDefault{background:#FFFFFF;}
#tabIconReview{position:absolute;left:406px;left:398px \9;top:41px;z-index:65533;width:90px;height:76px;}
img.review{width:90px;height:76px;border:2px solid #9cb945;background:#FFFFFF;background-position:center;background-repeat:no-repeat;}
.wrapper .tabbody{position:relative;float:left;clear:both;padding:10px;width: 95%;}
.tabbody table{width: 100%;}
.tabbody td{border:1px solid #BAC498;}
.tabbody td span{display: block;zoom:1;padding:0 4px;}

View File

@ -0,0 +1,54 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="robots" content="noindex, nofollow"/>
<script type="text/javascript" src="../internal.js"></script>
<link rel="stylesheet" type="text/css" href="emotion.css">
</head>
<body>
<div id="tabPanel" class="wrapper">
<div id="tabHeads" class="tabhead">
<span><var id="lang_input_choice"></var></span>
<span><var id="lang_input_Tuzki"></var></span>
<span><var id="lang_input_lvdouwa"></var></span>
<span><var id="lang_input_BOBO"></var></span>
<span><var id="lang_input_babyCat"></var></span>
<span><var id="lang_input_bubble"></var></span>
<span><var id="lang_input_youa"></var></span>
</div>
<div id="tabBodys" class="tabbody">
<div id="tab0"></div>
<div id="tab1"></div>
<div id="tab2"></div>
<div id="tab3"></div>
<div id="tab4"></div>
<div id="tab5"></div>
<div id="tab6"></div>
</div>
</div>
<div id="tabIconReview">
<img id='faceReview' class='review' src="../../themes/default/images/spacer.gif"/>
</div>
<script type="text/javascript" src="emotion.js"></script>
<script type="text/javascript">
var emotion = {
tabNum:7, //切换面板数量
SmilmgName:{ tab0:['j_00', 84], tab1:['t_00', 40], tab2:['w_00', 52], tab3:['B_00', 63], tab4:['C_00', 20], tab5:['i_f', 50], tab6:['y_00', 40] }, //图片前缀名
imageFolders:{ tab0:'jx2/', tab1:'tsj/', tab2:'ldw/', tab3:'bobo/', tab4:'babycat/', tab5:'face/', tab6:'youa/'}, //图片对应文件夹路径
imageCss:{tab0:'jd', tab1:'tsj', tab2:'ldw', tab3:'bb', tab4:'cat', tab5:'pp', tab6:'youa'}, //图片css类名
imageCssOffset:{tab0:35, tab1:35, tab2:35, tab3:35, tab4:35, tab5:25, tab6:35}, //图片偏移
SmileyInfor:{
tab0:['Kiss', 'Love', 'Yeah', '啊!', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '打酱油', '俯卧撑', '气愤', '?', '吻', '怒', '胜利', 'HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '微笑', '亲吻', '调皮', '惊恐', '耍酷', '发火', '害羞', '汗水', '大哭', '', '加油', '困', '你NB', '晕倒', '开心', '偷笑', '大哭', '滴汗', '叹气', '超赞', '??', '飞吻', '天使', '撒花', '生气', '被砸', '吓傻', '随意吐'],
tab1:['Kiss', 'Love', 'Yeah', '啊!', '背扭', '顶', '抖胸', '88', '汗', '瞌睡', '鲁拉', '拍砖', '揉脸', '生日快乐', '摊手', '睡觉', '瘫坐', '无聊', '星星闪', '旋转', '也不行', '郁闷', '正Music', '抓墙', '撞墙至死', '歪头', '戳眼', '飘过', '互相拍砖', '砍死你', '扔桌子', '少林寺', '什么?', '转头', '我爱牛奶', '我踢', '摇晃', '晕厥', '在笼子里', '震荡'],
tab2:['大笑', '瀑布汗~', '惊讶', '臭美', '傻笑', '抛媚眼', '发怒', '我错了', 'money', '气愤', '挑逗', '吻', '怒', '胜利', '委屈', '受伤', '说啥呢?', '闭嘴', '不', '逗你玩儿', '飞吻', '眩晕', '魔法', '我来了', '睡了', '我打', '闭嘴', '打', '打晕了', '刷牙', '爆揍', '炸弹', '倒立', '刮胡子', '邪恶的笑', '不要不要', '爱恋中', '放大仔细看', '偷窥', '超高兴', '晕', '松口气', '我跑', '享受', '修养', '哭', '汗', '啊~', '热烈欢迎', '打酱油', '俯卧撑', '?'],
tab3:['HI', 'KISS', '不说', '不要', '扯花', '大心', '顶', '大惊', '飞吻', '鬼脸', '害羞', '口水', '狂哭', '来', '泪眼', '流泪', '生气', '吐舌', '喜欢', '旋转', '再见', '抓狂', '汗', '鄙视', '拜', '吐血', '嘘', '打人', '蹦跳', '变脸', '扯肉', '吃To', '吃花', '吹泡泡糖', '大变身', '飞天舞', '回眸', '可怜', '猛抽', '泡泡', '苹果', '亲', '', '骚舞', '烧香', '睡', '套娃娃', '捅捅', '舞倒', '西红柿', '爱慕', '摇', '摇摆', '杂耍', '招财', '被殴', '被球闷', '大惊', '理想', '欧打', '呕吐', '碎', '吐痰'],
tab4:['发财了', '吃西瓜', '套牢', '害羞', '庆祝', '我来了', '敲打', '晕了', '胜利', '臭美', '被打了', '贪吃', '迎接', '酷', '顶', '幸运', '爱心', '躲', '送花', '选择'],
tab5:['微笑', '亲吻', '调皮', '惊讶', '耍酷', '发火', '害羞', '汗水', '大哭', '得意', '鄙视', '困', '夸奖', '晕倒', '疑问', '媒婆', '狂吐', '青蛙', '发愁', '亲吻', '', '爱心', '心碎', '玫瑰', '礼物', '哭', '奸笑', '可爱', '得意', '呲牙', '暴汗', '楚楚可怜', '困', '哭', '生气', '惊讶', '口水', '彩虹', '夜空', '太阳', '钱钱', '灯泡', '咖啡', '蛋糕', '音乐', '爱', '胜利', '赞', '鄙视', 'OK'],
tab6:['男兜', '女兜', '开心', '乖乖', '偷笑', '大笑', '抽泣', '大哭', '无奈', '滴汗', '叹气', '狂晕', '委屈', '超赞', '??', '疑问', '飞吻', '天使', '撒花', '生气', '被砸', '口水', '泪奔', '吓傻', '吐舌头', '点头', '随意吐', '旋转', '困困', '鄙视', '狂顶', '篮球', '再见', '欢迎光临', '恭喜发财', '稍等', '我在线', '恕不议价', '库房有货', '货在路上']
}
};
</script>
</body>
</html>

View File

@ -0,0 +1,186 @@
window.onload = function () {
editor.setOpt({
emotionLocalization:false
});
emotion.SmileyPath = editor.options.emotionLocalization === true ? 'images/' : "http://img.baidu.com/hi/";
emotion.SmileyBox = createTabList( emotion.tabNum );
emotion.tabExist = createArr( emotion.tabNum );
initImgName();
initEvtHandler( "tabHeads" );
};
function initImgName() {
for ( var pro in emotion.SmilmgName ) {
var tempName = emotion.SmilmgName[pro],
tempBox = emotion.SmileyBox[pro],
tempStr = "";
if ( tempBox.length ) return;
for ( var i = 1; i <= tempName[1]; i++ ) {
tempStr = tempName[0];
if ( i < 10 ) tempStr = tempStr + '0';
tempStr = tempStr + i + '.gif';
tempBox.push( tempStr );
}
}
}
function initEvtHandler( conId ) {
var tabHeads = $G( conId );
for ( var i = 0, j = 0; i < tabHeads.childNodes.length; i++ ) {
var tabObj = tabHeads.childNodes[i];
if ( tabObj.nodeType == 1 ) {
domUtils.on( tabObj, "click", (function ( index ) {
return function () {
switchTab( index );
};
})( j ) );
j++;
}
}
switchTab( 0 );
$G( "tabIconReview" ).style.display = 'none';
}
function InsertSmiley( url, evt ) {
var obj = {
src:editor.options.emotionLocalization ? editor.options.UEDITOR_HOME_URL + "dialogs/emotion/" + url : url
};
obj._src = obj.src;
editor.execCommand( 'insertimage', obj );
if ( !evt.ctrlKey ) {
dialog.popup.hide();
}
}
function switchTab( index ) {
autoHeight( index );
if ( emotion.tabExist[index] == 0 ) {
emotion.tabExist[index] = 1;
createTab( 'tab' + index );
}
//获取呈现元素句柄数组
var tabHeads = $G( "tabHeads" ).getElementsByTagName( "span" ),
tabBodys = $G( "tabBodys" ).getElementsByTagName( "div" ),
i = 0, L = tabHeads.length;
//隐藏所有呈现元素
for ( ; i < L; i++ ) {
tabHeads[i].className = "";
tabBodys[i].style.display = "none";
}
//显示对应呈现元素
tabHeads[index].className = "focus";
tabBodys[index].style.display = "block";
}
function autoHeight( index ) {
var iframe = dialog.getDom( "iframe" ),
parent = iframe.parentNode.parentNode;
switch ( index ) {
case 0:
iframe.style.height = "380px";
parent.style.height = "392px";
break;
case 1:
iframe.style.height = "220px";
parent.style.height = "232px";
break;
case 2:
iframe.style.height = "260px";
parent.style.height = "272px";
break;
case 3:
iframe.style.height = "300px";
parent.style.height = "312px";
break;
case 4:
iframe.style.height = "140px";
parent.style.height = "152px";
break;
case 5:
iframe.style.height = "260px";
parent.style.height = "272px";
break;
case 6:
iframe.style.height = "230px";
parent.style.height = "242px";
break;
default:
}
}
function createTab( tabName ) {
var faceVersion = "?v=1.1", //版本号
tab = $G( tabName ), //获取将要生成的Div句柄
imagePath = emotion.SmileyPath + emotion.imageFolders[tabName], //获取显示表情和预览表情的路径
positionLine = 11 / 2, //中间数
iWidth = iHeight = 35, //图片长宽
iColWidth = 3, //表格剩余空间的显示比例
tableCss = emotion.imageCss[tabName],
cssOffset = emotion.imageCssOffset[tabName],
textHTML = ['<table class="smileytable">'],
i = 0, imgNum = emotion.SmileyBox[tabName].length, imgColNum = 11, faceImage,
sUrl, realUrl, posflag, offset, infor;
for ( ; i < imgNum; ) {
textHTML.push( '<tr>' );
for ( var j = 0; j < imgColNum; j++, i++ ) {
faceImage = emotion.SmileyBox[tabName][i];
if ( faceImage ) {
sUrl = imagePath + faceImage + faceVersion;
realUrl = imagePath + faceImage;
posflag = j < positionLine ? 0 : 1;
offset = cssOffset * i * (-1) - 1;
infor = emotion.SmileyInfor[tabName][i];
textHTML.push( '<td class="' + tableCss + '" border="1" width="' + iColWidth + '%" style="border-collapse:collapse;" align="center" bgcolor="transparent" onclick="InsertSmiley(\'' + realUrl.replace( /'/g, "\\'" ) + '\',event)" onmouseover="over(this,\'' + sUrl + '\',\'' + posflag + '\')" onmouseout="out(this)">' );
textHTML.push( '<span>' );
textHTML.push( '<img style="background-position:left ' + offset + 'px;" title="' + infor + '" src="' + emotion.SmileyPath + (editor.options.emotionLocalization ? '0.gif" width="' : 'default/0.gif" width="') + iWidth + '" height="' + iHeight + '"></img>' );
textHTML.push( '</span>' );
} else {
textHTML.push( '<td width="' + iColWidth + '%" bgcolor="#FFFFFF">' );
}
textHTML.push( '</td>' );
}
textHTML.push( '</tr>' );
}
textHTML.push( '</table>' );
textHTML = textHTML.join( "" );
tab.innerHTML = textHTML;
}
function over( td, srcPath, posFlag ) {
td.style.backgroundColor = "#ACCD3C";
$G( 'faceReview' ).style.backgroundImage = "url(" + srcPath + ")";
if ( posFlag == 1 ) $G( "tabIconReview" ).className = "show";
$G( "tabIconReview" ).style.display = 'block';
}
function out( td ) {
td.style.backgroundColor = "transparent";
var tabIconRevew = $G( "tabIconReview" );
tabIconRevew.className = "";
tabIconRevew.style.display = 'none';
}
function createTabList( tabNum ) {
var obj = {};
for ( var i = 0; i < tabNum; i++ ) {
obj["tab" + i] = [];
}
return obj;
}
function createArr( tabNum ) {
var arr = [];
for ( var i = 0; i < tabNum; i++ ) {
arr[i] = 0;
}
return arr;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 216 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

View File

@ -0,0 +1,89 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="../internal.js"></script>
<style type="text/css">
.content{width:530px; height: 350px;margin: 10px auto;}
.content table{width: 100%}
.content table td{vertical-align: middle;}
#address{width:220px;height:21px;background: #FFF;border:1px solid #d7d7d7; line-height: 21px;}
</style>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
</head>
<body>
<div class="content">
<table>
<tr>
<td><label for="address"><var id="lang_input_address"></var></label></td>
<td><input id="address" type="text" /></td>
<td><a id="doSearch" href="javascript:void(0)" class="button"><var id="lang_input_search"></var></a></td>
</tr>
</table>
<div id="container" style="width: 100%; height: 340px;margin: 5px auto; border: 1px solid gray;"></div>
</div>
<script type="text/javascript">
domUtils.on(window,"load",function(){
var map = new google.maps.Map(document.getElementById('container'), {
zoom: 3,
streetViewControl: false,
scaleControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var imgcss;
var marker = new google.maps.Marker({
map: map,
draggable: true
});
function doSearch(){
var address = document.getElementById('address').value;
var geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': address}, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var bounds = results[0].geometry.viewport;
map.fitBounds(bounds);
marker.setPosition(results[0].geometry.location);
marker.setTitle(address);
} else alert(lang.searchError);
});
}
$G('address').onkeydown = function (evt){
evt = evt || event;
if (evt.keyCode == 13) {
doSearch();
}
};
$G("doSearch").onclick = doSearch;
dialog.onok = function (){
var center = map.getCenter();
var point = marker.getPosition();
var url = "http://maps.googleapis.com/maps/api/staticmap?center=" + center.lat() + ',' + center.lng() + "&zoom=" + map.zoom + "&size=520x340&maptype=" + map.getMapTypeId() + "&markers=" + point.lat() + ',' + point.lng() + "&sensor=false";
editor.execCommand('inserthtml', '<img width="520" height="340" src="' + url + '"' + (imgcss ? ' style="' + imgcss + '"' :'') + '/>');
};
function getPars(str,par){
var reg = new RegExp(par+"=((\\d+|[.,])*)","g");
return reg.exec(str)[1];
}
var img = editor.selection.getRange().getClosedNode();
if(img && img.src.indexOf("http://maps.googleapis.com/maps/api/staticmap")!=-1){
var url = img.getAttribute("src");
var centers = getPars(url,"center").split(",");
point = new google.maps.LatLng(Number(centers[0]),Number(centers[1]));
map.setCenter(point);
map.setZoom(Number(getPars(url,"zoom")));
centers = getPars(url,"markers").split(",");
marker.setPosition(new google.maps.LatLng(Number(centers[0]),Number(centers[1])));
imgcss = img.style.cssText;
}else{
setTimeout(function(){
doSearch();
},30)
}
});
</script>
</body>
</html>

View File

@ -0,0 +1,7 @@
.wrapper{width: 370px;margin: 10px auto;zoom: 1;}
.tabbody{height: 360px;}
.tabbody .panel{width:100%;height: 360px;position: absolute;background: #fff;}
.tabbody .panel h1{font-size:26px;margin: 5px 0 0 5px;}
.tabbody .panel p{font-size:12px;margin: 5px 0 0 5px;}
.tabbody table{width:90%;line-height: 20px;margin: 5px 0 0 5px;;}
.tabbody table thead{font-weight: bold;line-height: 25px;}

View File

@ -0,0 +1,82 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>帮助</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
<script type="text/javascript" src="../internal.js"></script>
<link rel="stylesheet" type="text/css" href="help.css">
</head>
<body>
<div class="wrapper" id="helptab">
<div id="tabHeads" class="tabhead">
<span class="focus" tabsrc="about"><var id="lang_input_about"></var></span>
<span tabsrc="shortcuts"><var id="lang_input_shortcuts"></var></span>
</div>
<div id="tabBodys" class="tabbody">
<div id="about" class="panel">
<h1>UEditor</h1>
<p id="version"></p>
<p><var id="lang_input_introduction"></var></p>
</div>
<div id="shortcuts" class="panel">
<table>
<thead>
<tr>
<td><var id="lang_Txt_shortcuts"></var></td>
<td><var id="lang_Txt_func"></var></td>
</tr>
</thead>
<tbody>
<tr>
<td>ctrl+b</td>
<td><var id="lang_Txt_bold"></var></td>
</tr>
<tr>
<td>ctrl+c</td>
<td><var id="lang_Txt_copy"></var></td>
</tr>
<tr>
<td>ctrl+x</td>
<td><var id="lang_Txt_cut"></var></td>
</tr>
<tr>
<td>ctrl+v</td>
<td><var id="lang_Txt_Paste"></var></td>
</tr>
<tr>
<td>ctrl+y</td>
<td><var id="lang_Txt_undo"></var></td>
</tr>
<tr>
<td>ctrl+z</td>
<td><var id="lang_Txt_redo"></var></td>
</tr>
<tr>
<td>ctrl+i</td>
<td><var id="lang_Txt_italic"></var></td>
</tr>
<tr>
<td>ctrl+u</td>
<td><var id="lang_Txt_underline"></var></td>
</tr>
<tr>
<td>ctrl+a</td>
<td><var id="lang_Txt_selectAll"></var></td>
</tr>
<tr>
<td>shift+enter</td>
<td><var id="lang_Txt_visualEnter"></var></td>
</tr>
<tr>
<td>alt+z</td>
<td><var id="lang_Txt_fullscreen"></var></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<script type="text/javascript" src="help.js"></script>
</body>
</html>

View File

@ -0,0 +1,56 @@
/**
* Created with JetBrains PhpStorm.
* User: xuheng
* Date: 12-9-26
* Time: 下午1:06
* To change this template use File | Settings | File Templates.
*/
/**
* tab点击处理事件
* @param tabHeads
* @param tabBodys
* @param obj
*/
function clickHandler( tabHeads,tabBodys,obj ) {
//head样式更改
for ( var k = 0, len = tabHeads.length; k < len; k++ ) {
tabHeads[k].className = "";
}
obj.className = "focus";
//body显隐
var tabSrc = obj.getAttribute( "tabSrc" );
for ( var j = 0, length = tabBodys.length; j < length; j++ ) {
var body = tabBodys[j],
id = body.getAttribute( "id" );
body.onclick = function(){
this.style.zoom = 1;
};
if ( id != tabSrc ) {
body.style.zIndex = 1;
} else {
body.style.zIndex = 200;
}
}
}
/**
* TAB切换
* @param tabParentId tab的父节点ID或者对象本身
*/
function switchTab( tabParentId ) {
var tabElements = $G( tabParentId ).children,
tabHeads = tabElements[0].children,
tabBodys = tabElements[1].children;
for ( var i = 0, length = tabHeads.length; i < length; i++ ) {
var head = tabHeads[i];
if ( head.className === "focus" )clickHandler(tabHeads,tabBodys, head );
head.onclick = function () {
clickHandler(tabHeads,tabBodys,this);
}
}
}
switchTab("helptab");
document.getElementById('version').innerHTML = parent.UE.version;

View File

@ -0,0 +1,894 @@
@charset "utf-8";
/* dialog样式 */
.wrapper {
zoom: 1;
width: 630px;
*width: 626px;
height: 380px;
margin: 0 auto;
padding: 10px;
position: relative;
font-family: sans-serif;
}
/*tab样式框大小*/
.tabhead {
float:left;
}
.tabbody {
width: 100%;
height: 346px;
position: relative;
clear: both;
}
.tabbody .panel {
position: absolute;
width: 0;
height: 0;
background: #fff;
overflow: hidden;
display: none;
}
.tabbody .panel.focus {
width: 100%;
height: 346px;
display: block;
}
/* 图片对齐方式 */
.alignBar{
float:right;
margin-top: 5px;
position: relative;
}
.alignBar .algnLabel{
float:left;
height: 20px;
line-height: 20px;
}
.alignBar #alignIcon{
zoom:1;
_display: inline;
display: inline-block;
position: relative;
}
.alignBar #alignIcon span{
float: left;
cursor: pointer;
display: block;
width: 19px;
height: 17px;
margin-right: 3px;
margin-left: 3px;
background-image: url(./images/alignicon.jpg);
}
.alignBar #alignIcon .none-align{
background-position: 0 -18px;
}
.alignBar #alignIcon .left-align{
background-position: -20px -18px;
}
.alignBar #alignIcon .right-align{
background-position: -40px -18px;
}
.alignBar #alignIcon .center-align{
background-position: -60px -18px;
}
.alignBar #alignIcon .none-align.focus{
background-position: 0 0;
}
.alignBar #alignIcon .left-align.focus{
background-position: -20px 0;
}
.alignBar #alignIcon .right-align.focus{
background-position: -40px 0;
}
.alignBar #alignIcon .center-align.focus{
background-position: -60px 0;
}
/* 远程图片样式 */
#remote {
z-index: 200;
}
#remote .top{
width: 100%;
margin-top: 25px;
}
#remote .left{
display: block;
float: left;
width: 300px;
height:10px;
}
#remote .right{
display: block;
float: right;
width: 300px;
height:10px;
}
#remote .row{
margin-left: 20px;
clear: both;
height: 40px;
}
#remote .row label{
text-align: center;
width: 50px;
zoom:1;
_display: inline;
display:inline-block;
vertical-align: middle;
}
#remote .row label.algnLabel{
float: left;
}
#remote input.text{
width: 150px;
padding: 3px 6px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
#remote input.text:focus {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
}
#remote #url{
width: 500px;
margin-bottom: 2px;
}
#remote #width,
#remote #height{
width: 20px;
margin-left: 2px;
margin-right: 2px;
}
#remote #border,
#remote #vhSpace,
#remote #title{
width: 180px;
margin-right: 5px;
}
#remote #lock{
}
#remote #lockicon{
zoom: 1;
_display:inline;
display: inline-block;
width: 20px;
height: 20px;
background: url("../../themes/default/images/lock.gif") -13px -13px no-repeat;
vertical-align: middle;
}
#remote #preview{
clear: both;
width: 260px;
height: 240px;
z-index: 9999;
margin-top: 10px;
background-color: #eee;
overflow: hidden;
}
/* 上传图片 */
.tabbody #upload.panel {
width: 0;
height: 0;
overflow: hidden;
position: absolute !important;
clip: rect(1px, 1px, 1px, 1px);
background: #fff;
display: block;
}
.tabbody #upload.panel.focus {
width: 100%;
height: 346px;
display: block;
clip: auto;
}
#upload .queueList {
margin: 0;
width: 100%;
height: 100%;
position: absolute;
overflow: hidden;
}
#upload p {
margin: 0;
}
.element-invisible {
width: 0 !important;
height: 0 !important;
border: 0;
padding: 0;
margin: 0;
overflow: hidden;
position: absolute !important;
clip: rect(1px, 1px, 1px, 1px);
}
#upload .placeholder {
margin: 10px;
border: 2px dashed #e6e6e6;
*border: 0px dashed #e6e6e6;
height: 172px;
padding-top: 150px;
text-align: center;
background: url(./images/image.png) center 70px no-repeat;
color: #cccccc;
font-size: 18px;
position: relative;
top:0;
*top: 10px;
}
#upload .placeholder .webuploader-pick {
font-size: 18px;
background: #00b7ee;
border-radius: 3px;
line-height: 44px;
padding: 0 30px;
*width: 120px;
color: #fff;
display: inline-block;
margin: 0 auto 20px auto;
cursor: pointer;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}
#upload .placeholder .webuploader-pick-hover {
background: #00a2d4;
}
#filePickerContainer {
text-align: center;
}
#upload .placeholder .flashTip {
color: #666666;
font-size: 12px;
position: absolute;
width: 100%;
text-align: center;
bottom: 20px;
}
#upload .placeholder .flashTip a {
color: #0785d1;
text-decoration: none;
}
#upload .placeholder .flashTip a:hover {
text-decoration: underline;
}
#upload .placeholder.webuploader-dnd-over {
border-color: #999999;
}
#upload .filelist {
list-style: none;
margin: 0;
padding: 0;
overflow-x: hidden;
overflow-y: auto;
position: relative;
height: 300px;
}
#upload .filelist:after {
content: '';
display: block;
width: 0;
height: 0;
overflow: hidden;
clear: both;
position: relative;
}
#upload .filelist li {
width: 113px;
height: 113px;
background: url(./images/bg.png);
text-align: center;
margin: 9px 0 0 9px;
*margin: 6px 0 0 6px;
position: relative;
display: block;
float: left;
overflow: hidden;
font-size: 12px;
}
#upload .filelist li p.log {
position: relative;
top: -45px;
}
#upload .filelist li p.title {
position: absolute;
top: 0;
left: 0;
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
top: 5px;
text-indent: 5px;
text-align: left;
}
#upload .filelist li p.progress {
position: absolute;
width: 100%;
bottom: 0;
left: 0;
height: 8px;
overflow: hidden;
z-index: 50;
margin: 0;
border-radius: 0;
background: none;
-webkit-box-shadow: 0 0 0;
}
#upload .filelist li p.progress span {
display: none;
overflow: hidden;
width: 0;
height: 100%;
background: #1483d8 url(./images/progress.png) repeat-x;
-webit-transition: width 200ms linear;
-moz-transition: width 200ms linear;
-o-transition: width 200ms linear;
-ms-transition: width 200ms linear;
transition: width 200ms linear;
-webkit-animation: progressmove 2s linear infinite;
-moz-animation: progressmove 2s linear infinite;
-o-animation: progressmove 2s linear infinite;
-ms-animation: progressmove 2s linear infinite;
animation: progressmove 2s linear infinite;
-webkit-transform: translateZ(0);
}
@-webkit-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@-moz-keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
@keyframes progressmove {
0% {
background-position: 0 0;
}
100% {
background-position: 17px 0;
}
}
#upload .filelist li p.imgWrap {
position: relative;
z-index: 2;
line-height: 113px;
vertical-align: middle;
overflow: hidden;
width: 113px;
height: 113px;
-webkit-transform-origin: 50% 50%;
-moz-transform-origin: 50% 50%;
-o-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webit-transition: 200ms ease-out;
-moz-transition: 200ms ease-out;
-o-transition: 200ms ease-out;
-ms-transition: 200ms ease-out;
transition: 200ms ease-out;
}
#upload .filelist li img {
width: 100%;
}
#upload .filelist li p.error {
background: #f43838;
color: #fff;
position: absolute;
bottom: 0;
left: 0;
height: 28px;
line-height: 28px;
width: 100%;
z-index: 100;
display:none;
}
#upload .filelist li .success {
display: block;
position: absolute;
left: 0;
bottom: 0;
height: 40px;
width: 100%;
z-index: 200;
background: url(./images/success.png) no-repeat right bottom;
background: url(./images/success.gif) no-repeat right bottom \9;
}
#upload .filelist li.filePickerBlock {
width: 113px;
height: 113px;
background: url(./images/image.png) no-repeat center 12px;
border: 1px solid #eeeeee;
border-radius: 0;
}
#upload .filelist li.filePickerBlock div.webuploader-pick {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
opacity: 0;
background: none;
font-size: 0;
}
#upload .filelist div.file-panel {
position: absolute;
height: 0;
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#80000000', endColorstr='#80000000') \0;
background: rgba(0, 0, 0, 0.5);
width: 100%;
top: 0;
left: 0;
overflow: hidden;
z-index: 300;
}
#upload .filelist div.file-panel span {
width: 24px;
height: 24px;
display: inline;
float: right;
text-indent: -9999px;
overflow: hidden;
background: url(./images/icons.png) no-repeat;
background: url(./images/icons.gif) no-repeat \9;
margin: 5px 1px 1px;
cursor: pointer;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
#upload .filelist div.file-panel span.rotateLeft {
display:none;
background-position: 0 -24px;
}
#upload .filelist div.file-panel span.rotateLeft:hover {
background-position: 0 0;
}
#upload .filelist div.file-panel span.rotateRight {
display:none;
background-position: -24px -24px;
}
#upload .filelist div.file-panel span.rotateRight:hover {
background-position: -24px 0;
}
#upload .filelist div.file-panel span.cancel {
background-position: -48px -24px;
}
#upload .filelist div.file-panel span.cancel:hover {
background-position: -48px 0;
}
#upload .statusBar {
height: 45px;
border-bottom: 1px solid #dadada;
margin: 0 10px;
padding: 0;
line-height: 45px;
vertical-align: middle;
position: relative;
}
#upload .statusBar .progress {
border: 1px solid #1483d8;
width: 198px;
background: #fff;
height: 18px;
position: absolute;
top: 12px;
display: none;
text-align: center;
line-height: 18px;
color: #6dbfff;
margin: 0 10px 0 0;
}
#upload .statusBar .progress span.percentage {
width: 0;
height: 100%;
left: 0;
top: 0;
background: #1483d8;
position: absolute;
}
#upload .statusBar .progress span.text {
position: relative;
z-index: 10;
}
#upload .statusBar .info {
display: inline-block;
font-size: 14px;
color: #666666;
}
#upload .statusBar .btns {
position: absolute;
top: 7px;
right: 0;
line-height: 30px;
}
#filePickerBtn {
display: inline-block;
float: left;
}
#upload .statusBar .btns .webuploader-pick,
#upload .statusBar .btns .uploadBtn,
#upload .statusBar .btns .uploadBtn.state-uploading,
#upload .statusBar .btns .uploadBtn.state-paused {
background: #ffffff;
border: 1px solid #cfcfcf;
color: #565656;
padding: 0 18px;
display: inline-block;
border-radius: 3px;
margin-left: 10px;
cursor: pointer;
font-size: 14px;
float: left;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
#upload .statusBar .btns .webuploader-pick-hover,
#upload .statusBar .btns .uploadBtn:hover,
#upload .statusBar .btns .uploadBtn.state-uploading:hover,
#upload .statusBar .btns .uploadBtn.state-paused:hover {
background: #f0f0f0;
}
#upload .statusBar .btns .uploadBtn,
#upload .statusBar .btns .uploadBtn.state-paused{
background: #00b7ee;
color: #fff;
border-color: transparent;
}
#upload .statusBar .btns .uploadBtn:hover,
#upload .statusBar .btns .uploadBtn.state-paused:hover{
background: #00a2d4;
}
#upload .statusBar .btns .uploadBtn.disabled {
pointer-events: none;
filter:alpha(opacity=60);
-moz-opacity:0.6;
-khtml-opacity: 0.6;
opacity: 0.6;
}
/* 图片管理样式 */
#online {
width: 100%;
height: 336px;
padding: 10px 0 0 0;
}
#online #imageList{
width: 100%;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
position: relative;
}
#online ul {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
#online li {
float: left;
display: block;
list-style: none;
padding: 0;
width: 113px;
height: 113px;
margin: 0 0 9px 9px;
*margin: 0 0 6px 6px;
background-color: #eee;
overflow: hidden;
cursor: pointer;
position: relative;
}
#online li.clearFloat {
float: none;
clear: both;
display: block;
width:0;
height:0;
margin: 0;
padding: 0;
}
#online li img {
cursor: pointer;
}
#online li .icon {
cursor: pointer;
width: 113px;
height: 113px;
position: absolute;
top: 0;
left: 0;
z-index: 2;
border: 0;
background-repeat: no-repeat;
}
#online li .icon:hover {
width: 107px;
height: 107px;
border: 3px solid #1094fa;
}
#online li.selected .icon {
background-image: url(images/success.png);
background-image: url(images/success.gif)\9;
background-position: 75px 75px;
}
#online li.selected .icon:hover {
width: 107px;
height: 107px;
border: 3px solid #1094fa;
background-position: 72px 72px;
}
/* 图片搜索样式 */
#search .searchBar {
width: 100%;
height: 30px;
margin: 10px 0 5px 0;
padding: 0;
}
#search input.text{
width: 150px;
padding: 3px 6px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
#search input.text:focus {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
}
#search input.searchTxt {
margin-left:5px;
padding-left: 5px;
background: #FFF;
width: 300px;
*width: 260px;
height: 21px;
line-height: 21px;
float: left;
dislay: block;
}
#search .searchType {
width: 65px;
height: 28px;
padding:0;
line-height: 28px;
border: 1px solid #d7d7d7;
border-radius: 0;
vertical-align: top;
margin-left: 5px;
float: left;
dislay: block;
}
#search #searchBtn,
#search #searchReset {
display: inline-block;
margin-bottom: 0;
margin-right: 5px;
padding: 4px 10px;
font-weight: 400;
text-align: center;
vertical-align: middle;
cursor: pointer;
background-image: none;
border: 1px solid transparent;
white-space: nowrap;
font-size: 14px;
border-radius: 4px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
vertical-align: top;
float: right;
}
#search #searchBtn {
color: white;
border-color: #285e8e;
background-color: #3b97d7;
}
#search #searchReset {
color: #333;
border-color: #ccc;
background-color: #fff;
}
#search #searchBtn:hover {
background-color: #3276b1;
}
#search #searchReset:hover {
background-color: #eee;
}
#search .msg {
margin-left: 5px;
}
#search .searchList{
width: 100%;
height: 300px;
overflow: hidden;
clear: both;
}
#search .searchList ul{
margin:0;
padding:0;
list-style:none;
clear: both;
width: 100%;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
zoom: 1;
position: relative;
}
#search .searchList li {
list-style:none;
float: left;
display: block;
width: 115px;
margin: 5px 10px 5px 20px;
*margin: 5px 10px 5px 15px;
padding:0;
font-size: 12px;
box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
position: relative;
vertical-align: top;
text-align: center;
overflow: hidden;
cursor: pointer;
filter: alpha(Opacity=100);
-moz-opacity: 1;
opacity: 1;
border: 2px solid #eee;
}
#search .searchList li.selected {
filter: alpha(Opacity=40);
-moz-opacity: 0.4;
opacity: 0.4;
border: 2px solid #00a0e9;
}
#search .searchList li p {
background-color: #eee;
margin: 0;
padding: 0;
position: relative;
width:100%;
height:115px;
overflow: hidden;
}
#search .searchList li p img {
cursor: pointer;
border: 0;
}
#search .searchList li a {
color: #999;
border-top: 1px solid #F2F2F2;
background: #FAFAFA;
text-align: center;
display: block;
padding: 0 5px;
width: 105px;
height:32px;
line-height:32px;
white-space:nowrap;
text-overflow:ellipsis;
text-decoration: none;
overflow: hidden;
word-break: break-all;
}
#search .searchList a:hover {
text-decoration: underline;
color: #333;
}
#search .searchList .clearFloat{
clear: both;
}

View File

@ -0,0 +1,120 @@
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>ueditor图片对话框</title>
<script type="text/javascript" src="../internal.js"></script>
<!-- jquery -->
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
<!-- webuploader -->
<script src="../../third-party/webuploader/webuploader.min.js"></script>
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
<!-- image dialog -->
<link rel="stylesheet" href="image.css" type="text/css" />
</head>
<body>
<div class="wrapper">
<div id="tabhead" class="tabhead">
<span class="tab" data-content-id="remote"><var id="lang_tab_remote"></var></span>
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
<span class="tab" data-content-id="search"><var id="lang_tab_search"></var></span>
</div>
<div class="alignBar">
<label class="algnLabel"><var id="lang_input_align"></var></label>
<span id="alignIcon">
<span id="noneAlign" class="none-align focus" data-align="none"></span>
<span id="leftAlign" class="left-align" data-align="left"></span>
<span id="rightAlign" class="right-align" data-align="right"></span>
<span id="centerAlign" class="center-align" data-align="center"></span>
</span>
<input id="align" name="align" type="hidden" value="none"/>
</div>
<div id="tabbody" class="tabbody">
<!-- 远程图片 -->
<div id="remote" class="panel">
<div class="top">
<div class="row">
<label for="url"><var id="lang_input_url"></var></label>
<span><input class="text" id="url" type="text"/></span>
</div>
</div>
<div class="left">
<div class="row">
<label><var id="lang_input_size"></var></label>
<span><var id="lang_input_width">&nbsp;&nbsp;</var><input class="text" type="text" id="width"/>px </span>
<span><var id="lang_input_height">&nbsp;&nbsp;</var><input class="text" type="text" id="height"/>px </span>
<span><input id="lock" type="checkbox" disabled="disabled"><span id="lockicon"></span></span>
</div>
<div class="row">
<label><var id="lang_input_border"></var></label>
<span><input class="text" type="text" id="border"/>px </span>
</div>
<div class="row">
<label><var id="lang_input_vhspace"></var></label>
<span><input class="text" type="text" id="vhSpace"/>px </span>
</div>
<div class="row">
<label><var id="lang_input_title"></var></label>
<span><input class="text" type="text" id="title"/></span>
</div>
</div>
<div class="right"><div id="preview"></div></div>
</div>
<!-- 上传图片 -->
<div id="upload" class="panel focus">
<div id="queueList" class="queueList">
<div class="statusBar element-invisible">
<div class="progress">
<span class="text">0%</span>
<span class="percentage"></span>
</div><div class="info"></div>
<div class="btns">
<div id="filePickerBtn"></div>
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
</div>
</div>
<div id="dndArea" class="placeholder">
<div class="filePickerContainer">
<div id="filePickerReady"></div>
</div>
</div>
<ul class="filelist element-invisible">
<li id="filePickerBlock" class="filePickerBlock"></li>
</ul>
</div>
</div>
<!-- 在线图片 -->
<div id="online" class="panel">
<div id="imageList"><var id="lang_imgLoading"></var></div>
</div>
<!-- 搜索图片 -->
<div id="search" class="panel">
<div class="searchBar">
<input id="searchTxt" class="searchTxt text" type="text" />
<select id="searchType" class="searchType">
<option value="&s=4&z=0"></option>
<option value="&s=1&z=19"></option>
<option value="&s=2&z=0"></option>
<option value="&s=3&z=0"></option>
</select>
<input id="searchReset" type="button" />
<input id="searchBtn" type="button" />
</div>
<div id="searchList" class="searchList"><ul id="searchListUl"></ul></div>
</div>
</div>
</div>
<script type="text/javascript" src="image.js"></script>
</body>
</html>

Some files were not shown because too many files have changed in this diff Show More