gfast-v3.2.1

This commit is contained in:
yxh
2023-01-20 10:58:15 +08:00
commit 0d5741c8d7
475 changed files with 120954 additions and 0 deletions

8
.env Normal file
View File

@@ -0,0 +1,8 @@
# port 端口号
VITE_PORT = 8888
# open 运行 npm run dev 时自动打开浏览器
VITE_OPEN = false
# public path 配置线上环境路径(打包)、本地通过 http-server 访问时,请置空即可
VITE_PUBLIC_PATH = /vue-next-admin-preview/

5
.env.development Normal file
View File

@@ -0,0 +1,5 @@
# 本地环境
ENV = 'development'
# 本地环境接口地址
VITE_API_URL = 'http://localhost:8808/'

8
.env.production Normal file
View File

@@ -0,0 +1,8 @@
# 线上环境
ENV = 'production'
# public path 配置线上环境路径(打包)、本地通过 http-server 访问时,请置空即可
VITE_PUBLIC_PATH = '/sys/'
# 线上环境接口地址
VITE_API_URL = '/'

18
.eslintignore Normal file
View File

@@ -0,0 +1,18 @@
*.sh
node_modules
lib
*.md
*.scss
*.woff
*.ttf
.vscode
.idea
dist
mock
public
bin
build
config
index.html
src/assets

63
.eslintrc.js Normal file
View File

@@ -0,0 +1,63 @@
module.exports = {
root: true,
env: {
browser: true,
es2021: true,
node: true,
},
parser: 'vue-eslint-parser',
parserOptions: {
ecmaVersion: 12,
parser: '@typescript-eslint/parser',
sourceType: 'module',
},
extends: ['plugin:vue/vue3-essential', 'plugin:vue/essential', 'eslint:recommended'],
plugins: ['vue', '@typescript-eslint'],
rules: {
// http://eslint.cn/docs/rules/
// https://eslint.vuejs.org/rules/
'@typescript-eslint/ban-ts-ignore': 'off',
'@typescript-eslint/explicit-function-return-type': 'off',
'@typescript-eslint/no-explicit-any': 'off',
'@typescript-eslint/no-var-requires': 'off',
'@typescript-eslint/no-empty-function': 'off',
'@typescript-eslint/no-use-before-define': 'off',
'@typescript-eslint/ban-ts-comment': 'off',
'@typescript-eslint/ban-types': 'off',
'@typescript-eslint/no-non-null-assertion': 'off',
'@typescript-eslint/explicit-module-boundary-types': 'off',
'vue/custom-event-name-casing': 'off',
'vue/attributes-order': 'off',
'vue/one-component-per-file': 'off',
'vue/html-closing-bracket-newline': 'off',
'vue/max-attributes-per-line': 'off',
'vue/multiline-html-element-content-newline': 'off',
'vue/singleline-html-element-content-newline': 'off',
'vue/attribute-hyphenation': 'off',
'vue/html-self-closing': 'off',
'vue/no-multiple-template-root': 'off',
'vue/require-default-prop': 'off',
'vue/no-v-model-argument': 'off',
'vue/no-arrow-functions-in-watch': 'off',
'vue/no-template-key': 'off',
'vue/no-v-html': 'off',
'vue/comment-directive': 'off',
'vue/no-parsing-error': 'off',
'vue/no-deprecated-v-on-native-modifier': 'off',
'vue/multi-word-component-names': 'off',
'no-useless-escape': 'off',
'no-sparse-arrays': 'off',
'no-prototype-builtins': 'off',
'no-constant-condition': 'off',
'no-use-before-define': 'off',
'no-restricted-globals': 'off',
'no-restricted-syntax': 'off',
'generator-star-spacing': 'off',
'no-unreachable': 'off',
'no-multiple-template-root': 'off',
'no-unused-vars': 'error',
'no-v-model-argument': 'off',
'no-case-declarations': 'off',
'no-console': 'error',
},
};

23
.gitignore vendored Normal file
View File

@@ -0,0 +1,23 @@
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

39
.prettierrc.js Normal file
View File

@@ -0,0 +1,39 @@
module.exports = {
// 一行最多多少个字符
printWidth: 150,
// 指定每个缩进级别的空格数
tabWidth: 2,
// 使用制表符而不是空格缩进行
useTabs: true,
// 在语句末尾打印分号
semi: true,
// 使用单引号而不是双引号
singleQuote: true,
// 更改引用对象属性的时间 可选值"<as-needed|consistent|preserve>"
quoteProps: 'as-needed',
// 在JSX中使用单引号而不是双引号
jsxSingleQuote: false,
// 多行时尽可能打印尾随逗号。(例如,单行数组永远不会出现逗号结尾。) 可选值"<none|es5|all>"默认none
trailingComma: 'es5',
// 在对象文字中的括号之间打印空格
bracketSpacing: true,
// jsx 标签的反尖括号需要换行
jsxBracketSameLine: false,
// 在单独的箭头函数参数周围包括括号 always(x) => x \ avoidx => x
arrowParens: 'always',
// 这两个选项可用于格式化以给定字符偏移量(分别包括和不包括)开始和结束的代码
rangeStart: 0,
rangeEnd: Infinity,
// 指定要使用的解析器,不需要写文件开头的 @prettier
requirePragma: false,
// 不需要自动在文件开头插入 @prettier
insertPragma: false,
// 使用默认的折行标准 always\never\preserve
proseWrap: 'preserve',
// 指定HTML文件的全局空格敏感度 css\strict\ignore
htmlWhitespaceSensitivity: 'css',
// Vue文件脚本和样式标签缩进
vueIndentScriptAndStyle: false,
// 换行符使用 lf 结尾是 可选值"<auto|lf|crlf|cr>"
endOfLine: 'lf',
};

367
CHANGELOG.md Normal file
View File

@@ -0,0 +1,367 @@
# <a href="https://gitee.com/lyt-top/vue-next-admin" target="_blank">vue-next-admin 更新日志</a>
🎉🎉🔥 `vue-next-admin` 基于 vue3.x 、Typescript、vite、Element plus 等适配手机、平板、pc 的后台开源免费模板库vue2.x 请切换 vue-prev-admin 分支)
## 2.2.0
`2022.07.10`
⚡⚡⚡ [/sec/stores/userInfo.ts](https://gitee.com/lyt-top/vue-next-admin/blob/master/src/stores/userInfo.ts) 下添加了 `getApiUserInfo` 接口模拟数据 `setTimeout` 为 3 秒
- 🌟 更新 依赖更新最新版本
- 🐞 修复 [主界面重新授权按钮点击卡死不跳转登录界面#I5C3JS](https://gitee.com/lyt-top/vue-next-admin/issues/I5C3JS),感谢[@Hero-Typ](https://gitee.com/tian_yu_peng)
- 🐞 修复 编译警告[#I5CVSB](https://gitee.com/lyt-top/vue-next-admin/issues/I5CVSB),全局替换成 `:deep(attr)`,感谢[@Linvas](https://gitee.com/linvas)。参考文档:[vue3 sfc-style](https://v3.cn.vuejs.org/api/sfc-style.html#style-scoped)。`node_modules\print-js\dist\print.js``print-js` 作者适配或去除 `package.json` 中的 `"print-js": "^1.6.0"`
- 🐞 修复 [vue-next-admin-template-js 版本前端控制路由userInfo.js 请求用户信息接口报错,加载不到路由 可以写个定时器模拟一下接口 一样的报错#I5F1HP](https://gitee.com/lyt-top/vue-next-admin/issues/I5F1HP),感谢[@白开水](https://gitee.com/libin951223)
## 2.1.1
`2022.05.27`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 深色模式下,`<el-button text></el-button>` 时,`:active` 样式
- 🎯 优化 [页面缓存在刷新之后失效 #I58U75](https://gitee.com/lyt-top/vue-next-admin/issues/I58U75)),感谢[@ls0428](https://gitee.com/ls0428)
- 🎯 优化 [SvgIcon 对下载的 Svg 图像设置颜色无效 #I59ND0](https://gitee.com/lyt-top/vue-next-admin/issues/I59ND0)),感谢[@elus_z](https://gitee.com/elus_z)
- 🎯 优化 `/src/utils/toolsValidate.ts` 工具类
- 🐞 修复 [布局切换TagsView 显示的 tab 会多一个出来 #I58WGM](https://gitee.com/lyt-top/vue-next-admin/issues/I58WGM),感谢[@lg_boy](https://gitee.com/lg_boy)
- 🐞 修复 [如果设置顶部面包屑导航开启图标 isBreadcrumbIcon=true 后,样式有点问题 如果不开启就是正常的 #I58VB8](https://gitee.com/lyt-top/vue-next-admin/issues/I58VB8)
- 🐞 修复 地址栏路由地址输入错误时,返回首页后,再次输入路由地址错误时,不跳转 404 问题
- 🐞 修复 [2.1.0 版本的图标选择组件多次点击后功能失效 #I590TH](https://gitee.com/lyt-top/vue-next-admin/issues/I590TH),感谢[@quber](https://gitee.com/quber)
## 2.1.0
`2022.04.18`
⚡⚡⚡ 此版本为破环性更新,优化内容如下:(谨慎更新!谨慎更新!!谨慎更新!!!)。因为 `vuex` 替换成 `pinia`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 部分界面图片不显示问题(更换 gitee 在线图片地址源)
- 🎯 优化 各界面方法引入与逻辑之间添加一行空行,方便区分内容
- 🎯 优化 图标选择器 [#I4YAHB](https://gitee.com/lyt-top/vue-next-admin/issues/I4YAHB),感谢[@真有你的](https://gitee.com/sunliusen)
- 🎯 优化 图标选择器 icon type 类型为 all 时,类型 ali、ele、awe 回显问题
- 🎯 优化 去掉开发环境 i18n 控制台警告,页面代码:[i18n/index.ts](https://gitee.com/lyt-top/vue-next-admin/blob/master/src/i18n/index.ts)
- 🎯 优化 `NextLoading.start()` 方法,防止第一次进入界面时出现短暂空白
- 🎯 优化 地址栏有参数退出登录,再次登录不跳之前界面问题 `src/layout/navBars/breadcrumb/user.vue`
- 🎯 优化 `SvgIcon` 组件,防止 `开启 Tagsview 图标` 时,`tagsView 右键菜单关闭` 报错问题,工作流不可连线、全屏时关闭按钮消失问题
- 🎯 优化 [如果 url 中有中文等特殊字符,第一次切换该 tab 时 keep-alive 失效#I55JS7](https://gitee.com/lyt-top/vue-next-admin/issues/I55JS7),感谢[yuyong1566](https://gitee.com/yuyong1566)
- 🎯 优化 [wangEditor](https://www.wangeditor.com/) 更新到 v5[vue3 版本线上示例中 wangeditor 富文本编辑器 demo 实例,无法换行#I5565B](https://gitee.com/lyt-top/vue-next-admin/issues/I5565B),感谢@[jenchih](https://gitee.com/jenchih)
- 🎯 优化 [在关闭 tagview 时,高度刷新时会会变化,出现滚动条](https://gitee.com/lyt-top/vue-next-admin/issues/I55FHM),感谢[张松](https://gitee.com/zs310071113)
- 🎯 优化 [路由参数](https://lyt-top.gitee.io/vue-next-admin-preview/#/params/common)演示
- 🎉 新增 [vuex](https://vuex.vuejs.org/) 替换成 [pinia](https://pinia.vuejs.org/getting-started.html)
- 🎉 新增 tagsView 支持自定义 tagsView 名称(文章详情时有用),前往体验:[路由参数/普通路由](https://lyt-top.gitee.io/vue-next-admin-preview/#/params/common)。新增 tagsView 支持自定义名称国际化,感谢[@q7but](https://gitee.com/q7but)、[!22 add 添加自定义 tagVIewName 拓展,支持国际化](https://gitee.com/lyt-top/vue-next-admin/pulls/22/files)、感谢[@tony_tong_xin](https://gitee.com/tony_tong_xin)
- 🐞 修复 适配 `"element-plus": "^2.1.9"2.2.0` 版本
- 🐞 修复 [导航栏横向布局后,一级菜单显示问题#I4Z3M3](https://gitee.com/lyt-top/vue-next-admin/issues/I4Z3M3)
- 🐞 修复 横向布局三级及以上导航菜单高亮、导航高度不统一问题
- 🐞 修复 分栏模式下,选中的菜单是 primary 样式,鼠标移入字也变成 primary 色了,感谢群友@孤夜-流殇
- 🐞 修复 [vuex 里面改了颜色 但是不生效 #I4WFMA](https://gitee.com/lyt-top/vue-next-admin/issues/I4WFMA)
- 🐞 修复 全局主题 primary 清空颜色后报错,[#I4X0LG](https://gitee.com/lyt-top/vue-next-admin/issues/I4X0LG),感谢[面向 BUG 编程](https://gitee.com/fhtfy)
- 🐞 修复 [.eslintrc.js 文件 rules 标签名错误 #I53IPK](https://gitee.com/lyt-top/vue-next-admin/issues/I53IPK),感谢[yuyong1566](https://gitee.com/yuyong1566)
- 🐞 修复 `开启 Tagsview 图标` 时,`tagsView 右键菜单关闭` 报错问题
- 🐞 修复 `router.push` 路径找不到时报错问题,`404、401 界面` 已移入到 `main` 主布局里(之前全屏)
- 🐞 修复 [全局修改组件大小失效了](https://gitee.com/lyt-top/vue-next-admin/issues/I551RP),感谢[lg_boy](https://gitee.com/lg_boy)
- 🐞 修复 [修改一下配置时,需要每次都清理 `window.localStorage` 浏览器永久缓存,配置才会生效,问题解决#I567R1](https://gitee.com/lyt-top/vue-next-admin/issues/I567R1),感谢[@lanbao123](https://gitee.com/lanbao123)
- 🐞 修复 [标记为需要缓存的 tab 页后,再次从左侧菜单打开,还是显示被缓存的页面内容#I4UY3G](https://gitee.com/lyt-top/vue-next-admin/issues/I4UY3G),感谢@axcc1234、特别感谢群友@华仔
- 🌈 重构 路由(`/src/router/index.ts`)解决 No match found for location with path "xxx"(前端控制,后端控制未解决) 问题
## 2.0.2
`2022.03.04`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 Alert 提示添加边框
- 🎯 优化 功能 / 数字滚动 演示界面
- 🐞 修复 全局主题按钮颜色 :active 问题
- 🐞 修复 Dropdown 下拉菜单样式问题
- 🐞 修复 SvgIcon 图标组件动态切换时报警告问题,[SvgIcon 改变 name 时可能导致图像不显示](https://gitee.com/lyt-top/vue-next-admin/issues/I4VGE0),感谢@axcc1234
## 2.0.1
`2022.02.25`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 svgIcon 图标组件
- 🎯 优化 vite.config.ts 打包,感谢群友@YourObjec
- 🐞 修复 tagViews 开启图标不显示问题(风格 5感谢群友@坏人
- 🐞 修复 [Element Plus 1.2.0-beta.6 以后的版本 el-table 在移动端无法左右滑动](https://gitee.com/lyt-top/vue-next-admin/issues/I4UPTP),感谢@YGDada
## 2.0.0
`2022.02.21`
⚡⚡⚡ 此版本为破环性更新,优化内容如下:(谨慎更新!谨慎更新!!谨慎更新!!!)。演示界面建议直接覆盖文件。如需使用之前版本,请前往[gitee 发行版](https://gitee.com/lyt-top/vue-next-admin/releases) 进行对应版本下载。基础版会基于 `master` 分支进行修改
- 🌟 更新 依赖更新最新版本
- 🌟 更新 登录页、首页
- 💔 移除 vue-web-screen-shot
- 💔 移除 城市多级联动,完整 json 数据请去 [vue-next-admin-images/menu](https://gitee.com/lyt-top/vue-next-admin-images/tree/master/menu) 仓库查看
- 💔 移除 功能/echartsTree 树图
- 💔 移除 其它设置/Tagsview 风格 2、Tagsview 风格 3
- 💔 移除 功能/验证器
- 🚧 调整 src/api 编写方式
- 🚧 调整 自定义封装公用组件演示,更好的维护
- 🎉 新增 Volar 支持vs code 配置参考 [Vue Language Features (Volar)](https://lyt-top.gitee.io/vue-next-admin-doc-preview/home/vscode/)
- 🎉 新增 `SvgIcon` 支持本地 svg 图标使用
- 🎉 新增 表单表格验证演示
- 🎯 优化 全局主题(移除 success、info、warning、danger
- 🎯 优化 工作流(开源)
- 🎯 优化 element plus svg 图标,`elementXXX` 改成 `ele-XXX`
- 🌈 重构 深色模式
- 🌹 合并 [处理 parent 的 h100 由于外层有 min-height 导致失效的问题](https://gitee.com/lyt-top/vue-next-admin/pulls/20),感谢@MaxNull@21030442-mao
- 🐞 修复 element plus 升级 `^1.3.0-beta.5` 后 组件 size 大小问题(大改:涉及布局、演示界面)
- 🐞 修复 vs code 使用 Vue Language Features (Volar) 插件 代码报红问题(可以把公用的 ts 类型定义封装起来公用)
## 1.2.2
`2021.12.21`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 iframes 滚动条问题
- 🎯 优化 部署后每次都要强制刷新清浏览器缓存问题
- 🎉 新增 工具类百分比验证演示
- 🐞 修复 [tag-view 标签右键会超出浏览器 #I4KN78](https://gitee.com/lyt-top/vue-next-admin/issues/I4KN78)
## 1.2.1
`2021.12.12`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 cropper 裁剪时卡顿问题 [#I4M2VQ](https://gitee.com/lyt-top/vue-next-admin/issues/I4M2VQ)
- 🎯 优化 Wangeditor 富文本编辑器的问题 [#I4LPC1](https://gitee.com/lyt-top/vue-next-admin/issues/I4LPC1)、[#I4LM7I](https://gitee.com/lyt-top/vue-next-admin/issues/I4LM7I)
- 🐞 修复 浏览器标题问题
- 🐞 修复 element plus svg 图标引入
- 🐞 修复 工作流不可以拖线连接问题
## 1.2.0
`2021.11.28`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 深色模式
- 🎯 优化 `/@/utils` 文件夹,合并删除单一内容
- 🎯 优化 系统设置:菜单管理(新增、修改)、角色管理(新增菜单权限)、用户管理、部门管理、字典管理
- 🎯 优化 登录界面逻辑、权限管理逻辑
- 🎯 优化 同步 [vue-next-admin-images](https://gitee.com/lyt-top/vue-next-admin-images/tree/master/menu) 后端控制菜单模拟数据
- 🎉 新增 适配 Font Icon 向 SVG Icon 迁移(改动大,"element-plus": "^1.2.0-beta.4" 谨慎更新)
- 🐞 修复 热更新问题,感谢@甜蜜蜜
- 🐞 修复 页面/element 字体图标演示
- 🐞 修复 功能/图标选择器演示,新增高级功能 [issues #I4GJXQ](https://gitee.com/lyt-top/vue-next-admin/issues/I4GJXQ)
## 1.1.2
`2021.10.17`
- 🌟 更新 依赖更新最新版本
- 🐞 修复 开启全屏时,刷新界面被还原成未全屏的状态
- 🎯 优化 tagsView 右键菜单关闭逻辑
- 🎯 优化 wangeditor 富文本编辑器(增加双向绑定)
- 🎉 新增 工作流(暂不开源)
- 🎉 新增 基础版 ts不带国际化切换 `vue-next-admin-template` 分支
## 1.1.1
`2021.09.25`
- 🌟 更新 依赖更新最新版本(`"element-plus": "^1.1.0-beta.13"` 版本运行错误,`^1.1.0-beta.16`修复横向菜单卡死问题)
- 🐞 修复 Dialog 弹窗位置错误、Drawer 抽屉内边距、el-menu 菜单收起时背景色问题
- 🎯 优化 锁屏界面自动锁屏(s/秒)必须设置至少 1 秒
- 🎉 新增 分栏布局,鼠标移入当前项时,显示当前项菜单内容
- 🎉 新增 工作流(未完成)
## 1.1.0
`2021.09.10`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 小屏模式下登录页二维码遮挡标题问题
- 🎉 新增 图片验证器
- 🎉 新增 动态复杂表单
- 🎉 新增 工作流(未完成)
- 🎉 新增 深色主题(伪深色,样式变动大,谨慎更新)
## 1.0.18
`2021.08.29`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 权限组件去掉顶级 div`/src/components/auth`
- 🎉 新增 布局配置添加恢复默认按钮
- 🐞 修复 升级 <a href="https://element-plus.gitee.io/#/zh-CN/component/changelog" target="_blank">element plus 1.1.0-beta.7</a>后项目无法启动、el-menu 菜单
- 🐞 修复 表格固定列时的层级、设置了相对定位时,遮挡左侧导航菜单问题
## 1.0.17
`2021.08.22`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 去除设置布局切换重置主题样式initSetLayoutChange切换布局需手动设置样式设置的样式自动同步各布局
- 🎯 优化 Dropdown 下拉菜单用户账号靠边时换行问题
- 🎯 优化 左侧导航菜单,共用菜单树,防止 `布局配置` 设置 `菜单 / 顶栏` 时,样式丢失等问题
- 🐞 修复 固定 header 后没有回到顶部的 bug拉取项目后运行不起来的 bug。<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/14" target="_blank">!14</a>,感谢<a href="https://gitee.com/wjs0509" target="_blank">@wjs0509</a>
- 🐞 修复 tagView 右键全屏后,浏览器窗口大小发生任何变化都会导致左边菜单显示出来,并且可点击打开对应页面。<a href="https://gitee.com/lyt-top/vue-next-admin/issues/I46E6T" target="_blank">I46E6T</a>
- 🐞 修复 默认设置 `菜单 / 顶栏` 样式不生效问题(/@/src/store/modules/themeConfig.ts
## 1.0.16
`2021.08.14`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 菜单高亮(详情且详情设置了 meta.isHide 时,顶级菜单高亮),感谢群友@YourObject
- 🎯 优化 详情路径写法:如父级(/pages/filtering那么详情为/pages/filtering/details?id=1。这样写可实现详情时父级菜单高亮否则写成/pages/filteringDetails?id=1顶级菜单将不会高亮。可参考`页面/过滤筛选组件`,点击当前图片进行测试
- 🎯 优化 tagsView 右键菜单全屏时,打开的界面高度问题
- 🎯 优化 图表批量 resize 问题
- 🐞 修复 菜单收起时设置全局主题primary 且有二级菜单时),文字高亮颜色不对
- 🐞 修复 国际化 <a href="https://gitee.com/lyt-top/vue-next-admin/issues/I43NPE" target="_blank">#I43NPE</a>。可参考:`页面/过滤筛选组件`,点击顶部语言切换,进行底部分页国际化查看
## 1.0.15
`2021.08.06`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 tagsView 右键菜单点击时的字段名id 已修改成 contextMenuClickId与路由中返回的 id 名冲突问题,感谢群友@伯牙已遇钟子期
- 🎉 新增 多个 form 表单验证界面演示
## 1.0.14
`2021.07.29`
- 🌟 更新 依赖更新最新版本vue、vuex、vue-router,出现问题,请手动降级。版本查看:<a href="https://www.npmjs.com/" target="_blank">vnpm</a>
- 🎯 优化 数据可视化图表演示加载卡顿问题、优化有图表的演示界面
- 🎯 优化 路由参数演示界面
- 🎯 优化 tagsView 操作演示界面由于存在相同路由多标签必须要传全部参数值query 或者 params
- 🎉 新增 开启 TagsView 共用开启时多个路由菜单共用一个详情组件参数为后点击的覆盖前面点击的tagsView 中只会出现一个(不支持同时出现多个 tagsView 标签))。关闭时:(多个路由菜单共用一个详情组件,参数不同,会同时出现多个 tagsView 标签)
- 🐞 修复 tagsView 共用(单标签)时,右键菜单功能点击,参数不对的问题(第 2n+个参数未覆盖第一个参数值)
- 🐞 修复 多 tagsView 标签(参数不同)、单个 tagsView 标签公用(参数不同)所带来的刷新功能、横向自动滚动等问题
- 🐞 修复 处理全屏若干问题,<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/12" target="_blank">pr!12</a>,感谢群友@另一个前端
## 1.0.13
`2021.07.25`
- 🌟 更新 依赖更新最新版本
- 🎉 新增 数据可视化演示界面(/visualizingDemo1、/visualizingDemo2
- 🎉 新增 登录页扫码登录
## 1.0.12
`2021.07.16`
- 🌟 更新 依赖更新最新版本
- 🎉 新增 数据可视化演示空界面(待完善)
- 🎯 优化 tagsView 动态路由xxx/:id/:name时的右键菜单刷新、关闭其它时参数丢失问题2021.07.15 优化)
- 🐞 修复 路由带参数时,复制路径到登录页,跳转后参数消失的问题
- 🐞 修复 设置多个外链,点击后,页面内容停留在上一个内容(内容未改变)、国际化处理、打开新窗口 sessionStorage 共享等
## 1.0.11
`2021.07.14`
- 🌟 更新 依赖更新最新版本
- 🎉 新增 路由参数、图片懒加载界面演示
- ⚠️ 警告 Form 表单 `binding value must be a string or number`,解决:加上 `label-position="top"` 不报警告(等待官方修复)
- 🎯 优化 锁屏界面动画效果、首页图表显示
- 🎯 优化 tagsView 右键菜单 `关闭` 功能逻辑
- 🐞 修复 开启 TagsView 拖拽报错及小于 `1000px` 时自动设置禁止拖拽(<a href="https://gitee.com/lyt-top/vue-next-admin/issues/I3ZRRI" target="_blank">#I3ZRRI</a>
- 🐞 修复 `iframe 内嵌、外链` 高度问题,使用 computed 进行计算
- 🐞 修复 默认布局开启 `侧边栏 Logo` 与关闭 `菜单水平折叠`,切换到横向布局时,菜单看不见的问题
- 🐞 修复 切换不同布局时,再去开启 `经典布局分割菜单` 功能不生效问题
- 🐞 修复 浏览器窗口标题中/英文切换不实时生效的问题
- 🐞 修复 切换布局时,某些功能不可以使用。部分界面不需要取消事件监听(proxy.mittBus.off('xxx'))
- 🐞 修复 动态路由带参数router-link 跳转问题(<a href="hhttps://gitee.com/lyt-top/vue-next-admin/issues/I3YX6G" target="_blank">#I3YX6G</a>
- 🐞 修复 横向菜单有二级菜单时,点击子级菜单不高亮问题
- 🐞 修复 功能 tagsView 操作演示不生效
## 1.0.10
`2021.07.07`
- 🌟 更新 依赖更新最新版本(字体图标无问题)
- 🎯 优化 内嵌 iframe、外链解决 tagsView 刷新问题
## 1.0.9
`2021.07.02`
- 🌟 更新 依赖更新最新版本
- 🎯 优化 图标选择器设置宽度、v-model 等问题
- 🎯 优化 滚动通知栏在手机上的体验
- 🎯 优化 系统管理/新增菜单(编辑菜单),使用 `图标选择器` 进行模拟
- 🎯 优化 字体图标(自动载入) 逻辑
- 🐞 修复 screenfull 全屏时,按键盘 esc 键图标不改变问题,感谢群友@伯牙已遇钟子期
## 1.0.8
`2021.06.29`
- 🌟 更新 依赖更新最新版本
- 🎉 新增 表单中英文切换演示
- 🎯 优化 登录页查看密码 icon 图标
- 🎯 优化 图标选择器
- 🎯 优化 拖动指令
- 🐞 修复 form 表单在页面小于 576px 时的排版问题
## 1.0.7
`2021.06.24`
- 🌟 更新 依赖更新最新版本
- 🎉 新增 拖动指令及其演示界面
- 🎯 优化 锁屏界面,解锁提示
- 🎯 优化 登录页在手机上显示的效果
## 1.0.6
`2021.06.23`
- 🎯 优化 去掉内嵌 iframe 内边距padding
- 🎯 优化 城市多级联动组件
- 🎯 优化 Tree 树形控件改成表格组件
- 🐞 修复 Cascader 级联选择器高度问题
## 1.0.5
`2021.06.22`
- 🌟 更新 vite 降级为@vite2.3.7,降级方法 `cnpm install vite@2.3.7`,防止 element plus 字体图标消失
- 🐞 修复 开启后端控制路由isRequestRoutes = true内嵌 iframe、外链不可使用的问题
## 1.0.4
`2021.06.19`
- 🌟 更新 依赖更新最新版本("vite": "^2.3.7")热更新无问题
- 🎉 新增 深克隆工具,方便开发,感谢<a href="https://gitee.com/kangert" target="_blank">@kangert</a>(<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/6" target="_blank">#6</a>)
- 🎯 优化 vuex 模块自动导入。感谢<a href="https://gitee.com/kangert" target="_blank">@kangert</a>(<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/4" target="_blank">#4</a>),感谢群友@web 小学生-第五君
- 🎯 优化 类型定义提高编码体验修复不能将类型“string | undefined”分配给类型“string”的问题。感谢<a href="https://gitee.com/kangert" target="_blank">@kangert</a>(<a href="https://gitee.com/lyt-top/vue-next-admin/pulls/5" target="_blank">#5</a>)
- 🎯 优化 `layout` 文件夹移动到与 `views` 文件夹同级(改动较大,`/@/views/layout` 变成 `/@/layout`
- 🎯 优化 页面有 `console.log``eslint` 不生效问题
- 🎯 优化 页面、ts 中 `any` 类型问题(改动较大)
- 🎯 优化 登录页在手机上显示的效果
- 🎯 优化 多行注释信息,鼠标放到方法名即可查看,更加直观的知道方法参数等。引入方法时需去掉以 `.ts` 结尾的后缀(改动较大)
- 🎯 优化 移除 `utils/storage.ts` 下的旧写法(改动较大)
- 🎯 优化 拆分 `router` 下内容,路由、前端、后端控制分开写,方便理解
- 🐞 修复 鼠标移入顶部用户信息栏 `开/关全屏` 文字反向问题
- 🐞 修复 热更新时NextLoading界面 loading 不消失问题 `window.nextLoading === undefined`
- 🐞 修复 vuex 中不可以使用 `/@/api/xxx` 下的接口调用问题
## 1.0.3
`2021.06.02`
- ❄️ 删除 G6 思维导图界面
- 🌟 更新 手动更新 vue、vue-router、vuex 到最近最多人使用的版本,出现不可预测的问题请降低版本。版本查看:<a href="https://www.npmjs.com/package/vue" target="_blank">vue 版本查看</a>
- 🐞 修复 开启后端控制路由 `isRequestRoutes` 在非首页刷新页面后,回到首页的问题,感谢群友@伯牙已遇钟子期
## 1.0.2
`2021.06.01`
- 🌟 更新 依赖更新最新版本
- 🐞 修复 菜单搜索中文不可以搜索的问题,感谢群友@逍遥天意
## 1.0.1
`2021.05.31`
- 🎉 新增 更新日志文件 `CHANGELOG.md`,以后每次更新都会在这里显示对应内容
- 🌟 更新 依赖更新最新版本
- 🐞 修复 分栏、经典布局路由设置 `meta.isHide``true` 时报错问题,感谢群友@29@芭芭拉
- 🐞 修复 经典布局点击 `tagsView` 左侧菜单数据不变问题

21
LICENSE Normal file
View File

@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2021 lyt-Top
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.

145
README.md Normal file
View File

@@ -0,0 +1,145 @@
<div align="center">
<img src="https://img-blog.csdnimg.cn/9efd5420327a46b7bd6d93524a97229d.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBAbHl0LXRvcA==,size_14,color_FFFFFF,t_70,g_se,x_16">
<p align="center">
<a href="https://v3.vuejs.org/" target="_blank">
<img src="https://img.shields.io/badge/vue.js-vue3.x-green" alt="vue">
</a>
<a href="https://element-plus.gitee.io/#/zh-CN/component/changelog" target="_blank">
<img src="https://img.shields.io/badge/element--plus-%3E1.0.0-blue" alt="element plus">
</a>
<a href="https://www.tslang.cn/" target="_blank">
<img src="https://img.shields.io/badge/typescript-%3E4.0.0-blue" alt="typescript">
</a>
<a href="https://vitejs.dev/" target="_blank">
<img src="https://img.shields.io/badge/vite-%3E2.0.0-yellow" alt="vite">
</a>
<a href="https://gitee.com/lyt-top/vue-next-admin/blob/master/LICENSE" target="_blank">
<img src="https://img.shields.io/badge/license-MIT-success" alt="license">
</a>
</p>
<p>&nbsp;</p>
</div>
#### 🌈 介绍
基于 vue3.x + CompositionAPI + typescript + vite + element plus + vue-router-next + next.vuex适配手机、平板、pc 的后台开源免费模板,希望减少工作量,帮助大家实现快速开发。
#### ⛱️ 线上预览
- vue3.x 版本预览vue-next-admin<a href="https://lyt-top.gitee.io/vue-next-admin-preview/#/login" target="_blank">https://lyt-top.gitee.io/vue-next-admin-preview/#/login</a>
- vue2.x 版本预览vue-prev-admin<a href="https://lyt-top.gitee.io/vue-prev-admin-preview/#/login" target="_blank">https://lyt-top.gitee.io/vue-prev-admin-preview/#/login</a>
#### 💒 代码仓库
- vue3.x 版本 <a href="https://gitee.com/lyt-top/vue-next-admin" target="_blank">https://gitee.com/lyt-top/vue-next-admin</a>
- vue2.x 版本 <a href="https://gitee.com/lyt-top/vue-next-admin/tree/vue-prev-admin" target="_blank">https://gitee.com/lyt-top/vue-next-admin/tree/vue-prev-admin</a>
#### 🚧 安装 cnpm、yarn
- 复制代码(桌面 cmd 运行) `npm install -g cnpm --registry=https://registry.npm.taobao.org`
- 复制代码(桌面 cmd 运行) `npm install -g yarn`
#### 🏭 环境支持
| Edge | Firefox | Chrome | Safari |
| --------- | ------------ | ----------- | ----------- |
| Edge ≥ 79 | Firefox ≥ 78 | Chrome ≥ 64 | Safari ≥ 12 |
> 由于 Vue3 不再支持 IE11故而 ElementPlus 也不支持 IE11 及之前版本。
#### ⚡ 使用说明
建议使用 cnpm因为 yarn 有时会报错。<a href="http://nodejs.cn/" target="_blank">node 版本 > 12xx.xx.x</a>
```bash
# 克隆项目
git clone https://gitee.com/lyt-top/vue-next-admin.git
# 进入项目
cd vue-next-admin
# 安装依赖
cnpm install
# 运行项目
cnpm run dev
# 打包发布
cnpm run build
```
#### 💯 学习交流加 QQ 群
- 若加群了没同意一般秒过那就是群满了500 人群请换一个群试试。群会定期清理半年6 个月)未发言的群友,资源有限,请谅解。建议勿加多群,可能会误伤!
- 查看开发文档:<a href="https://lyt-top.gitee.io/vue-next-admin-doc-preview" target="_blank">vue-next-admin-doc</a>
- 群号码:
1 群:<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=RdUY97Vx0T0vZ_1OOu-X1yFNkWgDwbjC&jump_from=webapi">665452019</a>
2 群:<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=zVfy3gNy7pNWVK3kMduDzwU369PZg2fw&jump_from=webapi">766356862</a>
3 群:<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=02EWb5P2JkP-8iwzaDadgFdxA0HSHPpn&jump_from=webapi">795345435</a>
4 群:<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=0gTFO04WwkeZZ6R4lju6gucbeXHK-wNd&jump_from=webapi">736626228</a>
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=RdUY97Vx0T0vZ_1OOu-X1yFNkWgDwbjC&jump_from=webapi">
<img src="https://img-blog.csdnimg.cn/35e00f12a3fe4820892ec630ca72f15f.png" width="220" height="220" alt="vue-next-admin 讨论群1" title="vue-next-admin 讨论群1"/>
</a>
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=zVfy3gNy7pNWVK3kMduDzwU369PZg2fw&jump_from=webapi">
<img src="https://img-blog.csdnimg.cn/5f1b548abd9f434eb41edde31d1c1fa9.png" width="220" height="220" alt="vue-next-admin 讨论群2" title="vue-next-admin 讨论群2"/>
</a>
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=02EWb5P2JkP-8iwzaDadgFdxA0HSHPpn&jump_from=webapi">
<img src="https://img-blog.csdnimg.cn/70c8a012dd304246bddeac2184c4ab3a.png" width="220" height="220" alt="vue-next-admin 讨论群3" title="vue-next-admin 讨论群3"/>
</a>
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=0gTFO04WwkeZZ6R4lju6gucbeXHK-wNd&jump_from=webapi">
<img src="https://img-blog.csdnimg.cn/e5c9704eed1342bc9d9e74b37203402d.png" width="220" height="220" alt="vue-next-admin 讨论群4" title="vue-next-admin 讨论群4"/>
</a>
#### 💒 集成后端
- <a target="_blank" href="https://github.com/PandaGoAdmin/PandaX">@熊猫 PandaGoAdmin</a>
- <a target="_blank" href="https://toscode.gitee.com/GionConnection/gopro_free">@甜蜜蜜 GoPro 平台</a>
- <a target="_blank" href="https://gitee.com/GionConnection/niupi-free">@甜蜜蜜 NiuPi 平台</a>
- <a target="_blank" href="https://gitee.com/tiger1103/gfast/tree/os-v3/">@游子 GFast-V3</a>
- <a target="_blank" href="https://gitee.com/diygw/diygw-ui-php/">@diygw.com gw-ui-php</a>
- <a target="_blank" href="https://gitee.com/zsvg/vboot-net">@zsvg vboot-net</a>
- <a target="_blank" href="https://gitee.com/zsvg/vboot-java">@zsvg vboot-java</a>
- <a target="_blank" href="https://gitee.com/wonderful-code/buildadmin">@青红造了个白 buildadmin</a>
- <a target="_blank" href="https://github.com/xiaodingding/iotfast">@Goodwell iotfast(一个开源的物联网平台)</a>
#### ❤️ 鸣谢列表
- <a href="https://github.com/vuejs/vue" target="_blank">vue</a>
- <a href="https://github.com/vuejs/vue-next" target="_blank">vue-next</a>
- <a href="https://github.com/ElemeFE/element" target="_blank">element-ui</a>
- <a href="https://github.com/element-plus/element-plus" target="_blank">element-plus</a>
- <a href="https://github.com/vuejs/vue-router-next" target="_blank">vue-router-next</a>
- <a href="https://github.com/vuejs/vuex" target="_blank">vuex</a>
- <a href="https://github.com/apache/echarts" target="_blank">echarts</a>
- <a href="https://github.com/axios/axios" target="_blank">axios</a>
- <a href="https://github.com/zenorocha/clipboard.js" target="_blank">clipboard</a>
- <a href="https://github.com/inorganik/countUp.js" target="_blank">countUp</a>
- <a href="https://github.com/developit/mitt" target="_blank">mitt</a>
- <a href="https://github.com/rstacruz/nprogress" target="_blank">nprogress</a>
- <a href="https://github.com/sindresorhus/screenfull.js" target="_blank">screenfull</a>
- <a href="https://github.com/SortableJS/Sortable" target="_blank">sortablejs</a>
- <a href="https://github.com/sass/sass" target="_blank">sass</a>
- <a href="https://github.com/microsoft/TypeScript" target="_blank">typescript</a>
- <a href="https://github.com/vitejs/vite" target="_blank">vite</a>
- <a href="https://github.com/wangeditor-team/wangEditor" target="_blank">wangeditor</a>
- <a href="https://github.com/fengyuanchen/cropperjs" target="_blank">cropperjs</a>
- <a href="https://github.com/davidshimjs/qrcodejs" target="_blank">qrcodejs</a>
- <a href="https://github.com/crabbly/Print.js" target="_blank">print-js</a>
- <a href="https://github.com/jbaysolutions/vue-grid-layout" target="_blank">vue-grid-layout</a>
- <a href="https://github.com/antoniandre/splitpanes" target="_blank">splitpanes</a>
- <a href="https://github.com/jsplumb/jsplumb" target="_blank">jsplumb</a>
#### 💕 特别感谢
特别感谢老哥们的建议、指导与帮忙。谢谢!
- <a href="https://gitee.com/click33/sa-plus" target="_blank">@省长</a>
- <a href="https://gitee.com/jskz/Jskz-SpringCloud" target="_blank">@唐参</a>
- <a href="https://gitee.com/chuange" target="_blank">@川歌</a>
- @华仔
#### 💌 支持作者
如果觉得框架不错,或者已经在使用了,希望你可以去 <a target="_blank" href="https://github.com/lyt-Top/vue-next-admin">Github</a> 或者
<a target="_blank" href="https://gitee.com/lyt-top/vue-next-admin">Gitee</a> 帮我点个 ⭐ Star这将是对我极大的鼓励与支持。

22
index.html Normal file
View File

@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
name="keywords"
content="vue-next-adminvue-prev-adminvue-admin-wonderful后台管理系统一站式平台模板希望可以帮你完成快速开发。vue2.xvue2.0vue2vue3vue3.xvue3.0CompositionAPItypescriptelement pluselementplusadminwonderfulwonderful-nextvue-next-adminvitevite-admin快速高效后台模板后台系统管理系统"
/>
<meta
name="description"
content="vue-next-admin基于 vue3 + CompositionAPI + typescript + vite + element plus适配手机、平板、pc 的后台开源免费管理系统模板vue-prev-admin基于 vue2 + element ui适配手机、平板、pc 的后台开源免费管理系统模板!"
/>
<link rel="icon" href="/favicon.ico" />
<title>gfast3.2后台管理系统</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>

2472
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

88
package.json Normal file
View File

@@ -0,0 +1,88 @@
{
"name": "vue-next-admin",
"version": "2.2.0",
"description": "vue3 vite next admin template",
"author": "lyt_20201208",
"license": "MIT",
"scripts": {
"dev": "vite --force",
"build": "vite build",
"lint-fix": "eslint --fix --ext .js --ext .jsx --ext .vue src/"
},
"dependencies": {
"@codemirror/lang-javascript": "^6.1.1",
"@codemirror/theme-one-dark": "^6.1.0",
"@element-plus/icons-vue": "^2.0.6",
"axios": "^0.27.2",
"codemirror": "^6.0.1",
"countup.js": "^2.3.2",
"cropperjs": "^1.5.12",
"echarts": "^5.3.3",
"echarts-gl": "^2.0.9",
"echarts-wordcloud": "^2.0.0",
"element-plus": "^2.2.9",
"js-cookie": "^3.0.1",
"jsplumb": "^2.15.6",
"lodash": "^4.17.21",
"mitt": "^3.0.0",
"nprogress": "^0.2.0",
"pinia": "^2.0.16",
"print-js": "^1.6.0",
"qrcodejs2-fixes": "^0.0.2",
"screenfull": "^6.0.2",
"sortablejs": "^1.15.0",
"spark-md5": "^3.0.2",
"splitpanes": "^3.1.1",
"vue": "^3.2.37",
"vue-clipboard3": "^2.0.0",
"vue-codemirror": "^6.1.1",
"vue-grid-layout": "^3.0.0-beta1",
"vue-i18n": "^9.2.2",
"vue-router": "^4.1.2",
"vue-simple-uploader": "^1.0.0-beta.5",
"vue-ueditor-wrap": "^3.0.8"
},
"devDependencies": {
"@types/node": "^18.0.6",
"@types/nprogress": "^0.2.0",
"@types/sortablejs": "^1.13.0",
"@typescript-eslint/eslint-plugin": "^5.30.7",
"@typescript-eslint/parser": "^5.30.7",
"@vitejs/plugin-vue": "^2.3.3",
"@vue/compiler-sfc": "^3.2.37",
"dotenv": "^16.0.1",
"eslint": "^8.20.0",
"eslint-plugin-vue": "^9.2.0",
"prettier": "^2.7.1",
"sass": "^1.53.0",
"sass-loader": "^13.0.2",
"typescript": "^4.7.4",
"vite": "^2.9.14",
"vue-eslint-parser": "^9.0.3"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
],
"bugs": {
"url": "https://gitee.com/lyt-top/vue-next-admin/issues"
},
"engines": {
"node": ">=12.0.0",
"npm": ">= 6.0.0"
},
"keywords": [
"vue",
"vue3",
"vuejs/vue-next",
"element-ui",
"element-plus",
"vue-next-admin",
"next-admin"
],
"repository": {
"type": "git",
"url": "https://gitee.com/lyt-top/vue-next-admin.git"
}
}

4
plugins.d.ts vendored Normal file
View File

@@ -0,0 +1,4 @@
declare module 'vue-grid-layout';
declare module 'qrcodejs2-fixes';
declare module 'splitpanes';
declare module 'js-cookie';

BIN
public/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

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{margin-left:4px;box-sizing:border-box;width:210px;height:30px;line-height:30px;border:1px solid #d7d7d7;border-radius:3px;padding:0 5px;outline:none;}
</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?20220503"></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: 15px;
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?20220503"></script>
<!-- jquery -->
<script type="text/javascript" src="../../third-party/jquery-1.10.2.js?20220503"></script>
<!-- webuploader -->
<script src="../../third-party/webuploader/webuploader.js?20220503"></script>
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css?20220503">
<!-- attachment dialog -->
<link rel="stylesheet" href="attachment.css?20220503" 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?20220503"></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) {
if (file.ext && acceptExtensions.indexOf(file.ext.toLowerCase()) != -1 && file.size <= fileMaxSize) {
fileCount++;
fileSize += file.size;
}
if (fileCount === 1) {
$placeHolder.addClass('element-invisible');
$statusBar.show();
}
addFile(file);
});
uploader.on('fileDequeued', function (file) {
if (file.ext && acceptExtensions.indexOf(file.ext.toLowerCase()) != -1 && file.size <= fileMaxSize) {
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参数
if (actionUrl.toLowerCase().indexOf('jsp') != -1) {
header['X_Requested_With'] = 'XMLHttpRequest';
}
});
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,94 @@
.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,52 @@
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="../internal.js?20220503"></script>
<link rel="stylesheet" type="text/css" href="background.css?20220503">
</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>
</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>
</div>
<script type="text/javascript" src="background.js?20220503"></script>
</body>
</html>

View File

@@ -0,0 +1,368 @@
(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";
}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 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,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?20220503"></script>
<link rel="stylesheet" type="text/css" href="emotion.css?20220503">
</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?20220503"></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,86 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="../internal.js?20220503"></script>
<style type="text/css">
.wrapper {
width: 600px;
padding: 10px;
height: 352px;
overflow: hidden;
position: relative;
border-bottom: 1px solid #d7d7d7
}
.editor-wrap {
display: flex;
}
.editor-wrap #editor {
width: 0;
flex-grow: 1;
border: 1px solid #CCC;
border-radius: 3px;
padding: 5px;
height: 100px;
outline: none;
}
.input-tip {
margin-top: 10px;
}
.input-tip a {
color: #0f0d0d;
}
.editor-preview {
background: #FFF;
border-radius: 3px;
margin-top: 10px;
border: 1px solid #EEE;
display:none;
}
.editor-preview .title {
padding: 5px;
}
.editor-preview .body {
padding: 5px 5px 15px 5px;
text-align: center;
}
.editor-preview .body .image {
max-width:100%;
max-height:100px;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="editor-wrap">
<textarea id="editor"></textarea>
</div>
<div class="input-tip">
基于 latex 语法,<a href="javascript:;" id="inputDemo">点击输入示例</a>
</div>
<div class="editor-preview" id="preview">
<div class="title">预览</div>
<div class="body">
<img class="image" id="previewImage" />
</div>
</div>
</div>
<script src="../../third-party/jquery-1.10.2.js?20220503"></script>
<script type="text/javascript" src="../../third-party/clipboard/clipboard.js?20220503"></script>
<script type="text/javascript" src="formula.js?20220903"></script>
<script type="text/javascript">
utils.domReady(function () {
Formula.init();
});
</script>
</body>
</html>

View File

@@ -0,0 +1,71 @@
function preg_quote(str, delimiter) {
// Quote regular expression characters plus an optional character
//
// version: 1107.2516
// discuss at: http://phpjs.org/functions/preg_quote
// + original by: booeyOH
// + improved by: Ates Goral (http://magnetiq.com)
// + improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// + bugfixed by: Onno Marsman
// + improved by: Brett Zamir (http://brett-zamir.me)
// * example 1: preg_quote("$40");
// * returns 1: '\$40'
// * example 2: preg_quote("*RRRING* Hello?");
// * returns 2: '\*RRRING\* Hello\?'
// * example 3: preg_quote("\\.+*?[^]$(){}=!<>|:");
// * returns 3: '\\\.\+\*\?\[\^\]\$\(\)\{\}\=\!\<\>\|\:'
return (str + '').replace(new RegExp('[.\\\\+*?\\[\\^\\]$(){}=!<>|:\\' + (delimiter || '') + '-]', 'g'), '\\$&');
}
var Formula = {
init: function () {
// console.log('Formula.init')
Formula.initValue();
Formula.initEvent();
Formula.initSubmit();
},
render: function () {
var content = $.trim($('#editor').val());
if (!content) {
$('#preview').hide();
return;
}
content = encodeURIComponent(content);
var formulaConfig = editor.getOpt('formulaConfig');
var src = formulaConfig.imageUrlTemplate.replace(/\{\}/, content);
$('#previewImage').attr('src', src);
$('#preview').show();
},
initValue: function () {
var img = editor.selection.getRange().getClosedNode();
if (img && img.getAttribute('data-formula-image') !== null) {
var value = img.getAttribute('data-formula-image');
if (value) {
$('#editor').val(decodeURIComponent(value));
Formula.render();
}
}
},
initEvent: function () {
var changeTimer = null;
// console.log('Formula.initEvent');
$('#editor').on('change keypress', function () {
changeTimer && clearTimeout(changeTimer);
changeTimer = setTimeout(function () {
Formula.render();
}, 1000);
});
$('#inputDemo').on('click', function () {
$('#editor').val('f(a) = \\frac{1}{2\\pi i} \\oint\\frac{f(z)}{z-a}dz');
Formula.render();
});
},
initSubmit: function () {
dialog.onok = function () {
editor.execCommand('formula', $.trim($('#editor').val()));
editor.fireEvent('saveScene');
};
dialog.oncancel = function () {
};
}
};

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?20220503"></script>
<link rel="stylesheet" type="text/css" href="help.css?20220503">
</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 Plus</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?20220503"></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,718 @@
@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 {
outline: 0;
}
#remote #url{
width: 400px;
margin-bottom: 2px;
}
#remote #imageSelect{
width: 100px;
display: inline-block;
background: #FFF;
border: 1px solid #EEE;
line-height: 26px;
text-align: center;
color: #333;
text-decoration: none;
border-radius: 3px;
vertical-align: top;
}
#remote #width,
#remote #height{
width: 30px;
margin-left: 2px;
margin-right: 2px;
text-align:center;
}
#remote #border,
#remote #vhSpace,
#remote #title{
width: 180px;
margin-right: 5px;
}
#remote #lock{
display:inline-block;
vertical-align: middle;
}
#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;
}

View File

@@ -0,0 +1,119 @@
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>ueditor图片对话框</title>
<script type="text/javascript" src="../internal.js?20220503"></script>
<!-- jquery -->
<script type="text/javascript" src="../../third-party/jquery-1.10.2.js?20220503"></script>
<!-- webuploader -->
<script src="../../third-party/webuploader/webuploader.js?20220503"></script>
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css?20220503">
<!-- image dialog -->
<link rel="stylesheet" href="image.css?20220503" type="text/css" />
</head>
<body>
<div class="wrapper">
<div id="tabhead" class="tabhead">
<span class="tab focus" data-content-id="remote"><var id="lang_tab_remote"></var></span>
<span style="display:none;" class="tab" data-content-id="upload"><var id="lang_tab_upload"></var></span>
<span style="display:none;" class="tab" data-content-id="online"><var id="lang_tab_online"></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>
<a href="javascript:;" id="imageSelect" style="display:none;">选择图片</a>
</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?20220503"></script>
</body>
</html>

File diff suppressed because it is too large Load Diff

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 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,99 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript" src="../internal.js?20220503"></script>
<style type="text/css">
.warp {width: 320px;height: 200px;margin-left:5px;padding: 20px 0 0 15px;position: relative;}
#url {width: 290px; margin-bottom: 2px; margin-left: -6px; margin-left: -2px\9;*margin-left:0;_margin-left:0; }
.format span{display: inline-block; width: 58px;text-align:left; zoom:1;}
table td{padding:5px 0;}
input[type="text"]{height:30px;border:1px solid #EEE;border-radius:3px;padding:0 5px;line-height:2px;outline:none;}
#align{width: 65px;height: 23px;line-height: 22px;}
</style>
</head>
<body>
<div class="warp">
<table width="300" cellpadding="0" cellspacing="0">
<tr>
<td colspan="2" class="format">
<span><var id="lang_input_address"></var></span>
<input style="width:200px" id="url" type="text" value=""/>
</td>
</tr>
<tr>
<td colspan="2" class="format"><span><var id="lang_input_width"></var></span><input style="width:200px" type="text" id="width"/> px</td>
</tr>
<tr>
<td colspan="2" class="format"><span><var id="lang_input_height"></var></span><input style="width:200px" type="text" id="height"/> px</td>
</tr>
<tr>
<td><span><var id="lang_input_isScroll"></var></span><input type="checkbox" id="scroll"/> </td>
<td><span><var id="lang_input_frameborder"></var></span><input type="checkbox" id="frameborder"/> </td>
</tr>
<tr>
<td colspan="2"><span><var id="lang_input_alignMode"></var></span>
<select id="align">
<option value=""></option>
<option value="left"></option>
<option value="right"></option>
</select>
</td>
</tr>
</table>
</div>
<script type="text/javascript">
var iframe = editor._iframe;
if(iframe){
$G("url").value = iframe.getAttribute("src")||"";
$G("width").value = iframe.getAttribute("width")||iframe.style.width.replace("px","")||"";
$G("height").value = iframe.getAttribute("height") || iframe.style.height.replace("px","") ||"";
$G("scroll").checked = (iframe.getAttribute("scrolling") == "yes") ? true : false;
$G("frameborder").checked = (iframe.getAttribute("frameborder") == "1") ? true : false;
$G("align").value = iframe.align ? iframe.align : "";
}
function queding(){
var url = $G("url").value.replace(/^\s*|\s*$/ig,""),
width = $G("width").value,
height = $G("height").value,
scroll = $G("scroll"),
frameborder = $G("frameborder"),
float = $G("align").value,
newIframe = editor.document.createElement("iframe"),
div;
if(!url){
alert(lang.enterAddress);
return false;
}
newIframe.setAttribute("src",/http:\/\/|https:\/\//ig.test(url) ? url : "http://"+url);
/^[1-9]+[.]?\d*$/g.test( width ) ? newIframe.setAttribute("width",width) : "";
/^[1-9]+[.]?\d*$/g.test( height ) ? newIframe.setAttribute("height",height) : "";
scroll.checked ? newIframe.setAttribute("scrolling","yes") : newIframe.setAttribute("scrolling","no");
frameborder.checked ? newIframe.setAttribute("frameborder","1",0) : newIframe.setAttribute("frameborder","0",0);
float ? newIframe.setAttribute("align",float) : newIframe.setAttribute("align","");
if(iframe){
iframe.parentNode.insertBefore(newIframe,iframe);
domUtils.remove(iframe);
}else{
div = editor.document.createElement("div");
div.appendChild(newIframe);
editor.execCommand("inserthtml",div.innerHTML);
}
editor._iframe = null;
dialog.close();
}
dialog.onok = queding;
$G("url").onkeydown = function(evt){
evt = evt || event;
if(evt.keyCode == 13){
queding();
}
};
$focus($G( "url" ));
</script>
</body>
</html>

View File

@@ -0,0 +1,81 @@
(function () {
var parent = window.parent;
//dialog对象
dialog = parent.$EDITORUI[window.frameElement.id.replace( /_iframe$/, '' )];
//当前打开dialog的编辑器实例
editor = dialog.editor;
UE = parent.UE;
domUtils = UE.dom.domUtils;
utils = UE.utils;
browser = UE.browser;
ajax = UE.ajax;
$G = function ( id ) {
return document.getElementById( id )
};
//focus元素
$focus = function ( node ) {
setTimeout( function () {
if ( browser.ie ) {
var r = node.createTextRange();
r.collapse( false );
r.select();
} else {
node.focus()
}
}, 0 )
};
utils.loadFile(document,{
href:editor.options.themePath + editor.options.theme + "/dialogbase.css?cache="+Math.random(),
tag:"link",
type:"text/css",
rel:"stylesheet"
});
lang = editor.getLang(dialog.className.split( "-" )[2]);
if(lang){
domUtils.on(window,'load',function () {
var langImgPath = editor.options.langPath + editor.options.lang + "/images/";
//针对静态资源
for ( var i in lang["static"] ) {
var dom = $G( i );
if(!dom) continue;
var tagName = dom.tagName,
content = lang["static"][i];
if(content.src){
//clone
content = utils.extend({},content,false);
content.src = langImgPath + content.src;
}
if(content.style){
content = utils.extend({},content,false);
content.style = content.style.replace(/url\s*\(/g,"url(" + langImgPath)
}
switch ( tagName.toLowerCase() ) {
case "var":
dom.parentNode.replaceChild( document.createTextNode( content ), dom );
break;
case "select":
var ops = dom.options;
for ( var j = 0, oj; oj = ops[j]; ) {
oj.innerHTML = content.options[j++];
}
for ( var p in content ) {
p != "options" && dom.setAttribute( p, content[p] );
}
break;
default :
domUtils.setAttributes( dom, content);
}
}
} );
}
})();

View File

@@ -0,0 +1,134 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="../internal.js?20220503"></script>
<style type="text/css">
*{margin:0;padding:0;color: #838383;}
table{font-size: 12px;margin: 10px;line-height:36px;width:100%;}
.txt{box-sizing:border-box;width:90%;height:30px;line-height:30px;border:1px solid #d7d7d7;border-radius:3px;padding:0 5px;outline:none;}
</style>
</head>
<body>
<div style="padding:10px;">
<table>
<tr>
<td><label for="text"> <var id="lang_input_text"></var></label></td>
<td><input class="txt" id="text" type="text" disabled="true"/></td>
</tr>
<tr>
<td><label for="href"> <var id="lang_input_url"></var></label></td>
<td><input class="txt" id="href" type="text" /></td>
</tr>
<tr>
<td><label for="title"> <var id="lang_input_title"></var></label></td>
<td><input class="txt" id="title" type="text"/></td>
</tr>
<tr>
<td colspan="2">
<label for="target"><var id="lang_input_target"></var></label>
<input id="target" type="checkbox"/>
</td>
</tr>
<tr>
<td colspan="2" id="msg"></td>
</tr>
</table>
</div>
<script type="text/javascript">
editor.setOpt('allowLinkProtocols', ['http:', 'https:', '#', '/', 'ftp:', 'mailto:', 'tel:']);
var allowLinkProtocols = editor.getOpt('allowLinkProtocols');
var range = editor.selection.getRange(),
link = range.collapsed ? editor.queryCommandValue( "link" ) : editor.selection.getStart(),
url,
text = $G('text'),
rangeLink = domUtils.findParentByTagName(range.getCommonAncestor(),'a',true),
orgText;
link = domUtils.findParentByTagName( link, "a", true );
if(link){
url = utils.html(link.getAttribute( '_href' ) || link.getAttribute( 'href', 2 ));
if(rangeLink === link && !link.getElementsByTagName('img').length){
text.removeAttribute('disabled');
orgText = text.value = link[browser.ie ? 'innerText':'textContent'];
}else{
text.setAttribute('disabled','true');
text.value = lang.validLink;
}
}else{
if(range.collapsed){
text.removeAttribute('disabled');
text.value = '';
}else{
text.setAttribute('disabled','true');
text.value = lang.validLink;
}
}
$G("title").value = url ? link.title : "";
$G("href").value = url ? url: '';
$G("target").checked = url && link.target == "_blank" ? true : false;
$focus($G("href"));
function handleDialogOk(){
var href =$G('href').value.replace(/^\s+|\s+$/g, '');
if(href){
if(!hrefStartWith(href, allowLinkProtocols)) {
href = "http://" + href;
}
var obj = {
'href' : href,
'target' : $G("target").checked ? "_blank" : '_self',
'title' : $G("title").value.replace(/^\s+|\s+$/g, ''),
'_href':href
};
//修改链接内容的情况太特殊了,所以先做到这里了
//todo:情况多的时候做到command里
if(orgText && text.value != orgText){
link[browser.ie ? 'innerText' : 'textContent'] = obj.textValue = text.value;
range.selectNode(link).select()
}
if(range.collapsed){
obj.textValue = text.value;
}
editor.execCommand('link',utils.clearEmptyAttrs(obj) );
dialog.close();
}
}
dialog.onok = handleDialogOk;
$G('href').onkeydown = $G('title').onkeydown = function(evt){
evt = evt || window.event;
if (evt.keyCode == 13) {
handleDialogOk();
return false;
}
};
$G('href').onblur = function(){
if(!hrefStartWith(this.value, allowLinkProtocols)){
$G("msg").innerHTML = "<span style='color: red'>"+lang.httpPrompt+"</span>";
}else{
$G("msg").innerHTML = "";
}
};
function hrefStartWith(href,arr){
href = href.replace(/^\s+|\s+$/g, '');
for(var i=0,ai;ai=arr[i++];){
if(href.indexOf(ai)==0){
return true;
}
}
return false;
}
</script>
</body>
</html>

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"/>
<style>
html,body{
height:100%;
width:100%;
padding:0;
margin:0;
}
#preview{
width:100%;
height:100%;
padding:0;
margin:0;
}
#preview *{font-family:sans-serif;font-size:16px;}
</style>
<script type="text/javascript" src="../internal.js?20220503"></script>
<script src="../../ueditor.parse.js?20220503"></script>
<title></title>
</head>
<body class="view">
<div id="preview" style="margin:8px">
</div>
</body>
<script>
document.getElementById('preview').innerHTML = editor.getContent();
uParse('#preview',{
rootPath : '../../',
chartContainerHeight:500
})
dialog.oncancel = function(){
document.getElementById('preview').innerHTML = '';
}
</script>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 628 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 608 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 516 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 578 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 519 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 657 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 454 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 536 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 435 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 330 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 775 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 444 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 511 B

View File

@@ -0,0 +1,72 @@
/*common
*/
body{margin: 0;}
table{width:100%;}
table td{padding:2px 4px;vertical-align: middle;}
a{text-decoration: none;}
em{font-style: normal;}
.border_style1{border: 1px solid #ccc;border-radius: 5px;box-shadow:2px 2px 5px #d3d6da;}
/*module
*/
.main{margin: 8px;overflow: hidden;}
.hot{float:left;height:335px;}
.drawBoard{position: relative; cursor: crosshair;}
.brushBorad{position: absolute;left:0;top:0;z-index: 998;}
.picBoard{border: none;text-align: center;line-height: 300px;cursor: default;}
.operateBar{margin-top:10px;font-size:12px;text-align: center;}
.operateBar span{margin-left: 10px;}
.drawToolbar{float:right;width:110px;height:300px;overflow: hidden;}
.colorBar{margin-top:10px;font-size: 12px;text-align: center;}
.colorBar a{display:block;width: 10px;height: 10px;border:1px solid #1006F1;border-radius: 3px; box-shadow:2px 2px 5px #d3d6da;opacity: 0.3}
.sectionBar{margin-top:15px;font-size: 12px;text-align: center;}
.sectionBar a{display:inline-block;width:10px;height:12px;color: #888;text-indent: -999px;opacity: 0.3}
.size1{background: url('images/size.png') 1px center no-repeat ;}
.size2{background: url('images/size.png') -10px center no-repeat;}
.size3{background: url('images/size.png') -22px center no-repeat;}
.size4{background: url('images/size.png') -35px center no-repeat;}
.addImgH{position: relative;}
.addImgH_form{position: absolute;left: 18px;top: -1px;width: 75px;height: 21px;opacity: 0;cursor: pointer;}
.addImgH_form input{width: 100%;}
/*scrawl遮罩层
*/
.maskLayerNull{display: none;}
.maskLayer{position: absolute;top:0;left:0;width: 100%; height: 100%;opacity: 0.7;
background-color: #fff;text-align:center;font-weight:bold;line-height:300px;z-index: 1000;}
/*btn state
*/
.previousStepH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/undoH.png');cursor: pointer;}
.previousStepH .text{color:#888;cursor:pointer;}
.previousStep .icon{display: inline-block;width:16px;height:16px;background-image: url('images/undo.png');cursor:default;}
.previousStep .text{color:#ccc;cursor:default;}
.nextStepH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/redoH.png');cursor: pointer;}
.nextStepH .text{color:#888;cursor:pointer;}
.nextStep .icon{display: inline-block;width:16px;height:16px;background-image: url('images/redo.png');cursor:default;}
.nextStep .text{color:#ccc;cursor:default;}
.clearBoardH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/emptyH.png');cursor: pointer;}
.clearBoardH .text{color:#888;cursor:pointer;}
.clearBoard .icon{display: inline-block;width:16px;height:16px;background-image: url('images/empty.png');cursor:default;}
.clearBoard .text{color:#ccc;cursor:default;}
.scaleBoardH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/scaleH.png');cursor: pointer;}
.scaleBoardH .text{color:#888;cursor:pointer;}
.scaleBoard .icon{display: inline-block;width:16px;height:16px;background-image: url('images/scale.png');cursor:default;}
.scaleBoard .text{color:#ccc;cursor:default;}
.removeImgH .icon{display: inline-block;width:16px;height:16px;background-image: url('images/delimgH.png');cursor: pointer;}
.removeImgH .text{color:#888;cursor:pointer;}
.removeImg .icon{display: inline-block;width:16px;height:16px;background-image: url('images/delimg.png');cursor:default;}
.removeImg .text{color:#ccc;cursor:default;}
.addImgH .icon{vertical-align:top;display: inline-block;width:16px;height:16px;background-image: url('images/addimg.png')}
.addImgH .text{color:#888;cursor:pointer;}
/*icon
*/
.brushIcon{display: inline-block;width:16px;height:16px;background-image: url('images/brush.png')}
.eraserIcon{display: inline-block;width:16px;height:16px;background-image: url('images/eraser.png')}

View File

@@ -0,0 +1,95 @@
<!DOCTYPE html>
<html>
<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?20220503"></script>
<link rel="stylesheet" type="text/css" href="scrawl.css?20220503">
</head>
<body>
<div class="main" id="J_wrap">
<div class="hot">
<div class="drawBoard border_style1">
<canvas id="J_brushBoard" class="brushBorad" width="360" height="300"></canvas>
<div id="J_picBoard" class="picBoard" style="width: 360px;height: 300px"></div>
</div>
<div id="J_operateBar" class="operateBar">
<span id="J_previousStep" class="previousStep">
<em class="icon"></em>
<em class="text"><var id="lang_input_previousStep"></var></em>
</span>
<span id="J_nextStep" class="nextStep">
<em class="icon"></em>
<em class="text"><var id="lang_input_nextsStep"></var></em>
</span>
<span id="J_clearBoard" class="clearBoard">
<em class="icon"></em>
<em class="text"><var id="lang_input_clear"></var></em>
</span>
<span id="J_sacleBoard" class="scaleBoard">
<em class="icon"></em>
<em class="text"><var id="lang_input_ScalePic"></var></em>
</span>
</div>
</div>
<div class="drawToolbar border_style1">
<div id="J_colorBar" class="colorBar"></div>
<div id="J_brushBar" class="sectionBar">
<em class="brushIcon"></em>
<a href="javascript:void(0)" class="size1">1</a>
<a href="javascript:void(0)" class="size2">3</a>
<a href="javascript:void(0)" class="size3">5</a>
<a href="javascript:void(0)" class="size4">7</a>
</div>
<div id="J_eraserBar" class="sectionBar">
<em class="eraserIcon"></em>
<a href="javascript:void(0)" class="size1">1</a>
<a href="javascript:void(0)" class="size2">3</a>
<a href="javascript:void(0)" class="size3">5</a>
<a href="javascript:void(0)" class="size4">7</a>
</div>
<div class="sectionBar">
<div id="J_addImg" class="addImgH">
<em class="icon"></em>
<em class="text"><var id="lang_input_addPic"></var></em>
<form method="post" id="fileForm" enctype="multipart/form-data" class="addImgH_form" target="up">
<input type="file" name="upfile" id="J_imgTxt"
accept="image/gif,image/jpeg,image/png,image/jpg,image/bmp"/>
</form>
<iframe name="up" style="display: none"></iframe>
</div>
</div>
<div class="sectionBar">
<span id="J_removeImg" class="removeImg">
<em class="icon"></em>
<em class="text"><var id="lang_input_removePic"></var></em>
</span>
</div>
</div>
</div>
<div id="J_maskLayer" class="maskLayerNull"></div>
<script type="text/javascript" src="scrawl.js?20220503"></script>
<script type="text/javascript">
var settings = {
drawBrushSize:3, //画笔初始大小
drawBrushColor:"#4bacc6", //画笔初始颜色
colorList:['c00000', 'ff0000', 'ffc000', 'ffff00', '92d050', '00b050', '00b0f0', '0070c0', '002060', '7030a0', 'ffffff',
'000000', 'eeece1', '1f497d', '4f81bd', 'c0504d', '9bbb59', '8064a2', '4bacc6', 'f79646'], //画笔选择颜色
saveNum:10 //撤销次数
};
var scrawlObj = new scrawl( settings );
scrawlObj.isCancelScrawl = false;
dialog.onok = function () {
exec( scrawlObj );
return false;
};
dialog.oncancel = function () {
scrawlObj.isCancelScrawl = true;
};
</script>
</body>
</html>

View File

@@ -0,0 +1,670 @@
/**
* Created with JetBrains PhpStorm.
* User: xuheng
* Date: 12-5-22
* Time: 上午11:38
* To change this template use File | Settings | File Templates.
*/
var scrawl = function (options) {
options && this.initOptions(options);
};
(function () {
var canvas = $G("J_brushBoard"),
context = canvas.getContext('2d'),
drawStep = [], //undo redo存储
drawStepIndex = 0; //undo redo指针
scrawl.prototype = {
isScrawl:false, //是否涂鸦
brushWidth:-1, //画笔粗细
brushColor:"", //画笔颜色
initOptions:function (options) {
var me = this;
me.originalState(options);//初始页面状态
me._buildToolbarColor(options.colorList);//动态生成颜色选择集合
me._addBoardListener(options.saveNum);//添加画板处理
me._addOPerateListener(options.saveNum);//添加undo redo clearBoard处理
me._addColorBarListener();//添加颜色选择处理
me._addBrushBarListener();//添加画笔大小处理
me._addEraserBarListener();//添加橡皮大小处理
me._addAddImgListener();//添加增添背景图片处理
me._addRemoveImgListenter();//删除背景图片处理
me._addScalePicListenter();//添加缩放处理
me._addClearSelectionListenter();//添加清楚选中状态处理
me._originalColorSelect(options.drawBrushColor);//初始化颜色选中
me._originalBrushSelect(options.drawBrushSize);//初始化画笔选中
me._clearSelection();//清楚选中状态
},
originalState:function (options) {
var me = this;
me.brushWidth = options.drawBrushSize;//同步画笔粗细
me.brushColor = options.drawBrushColor;//同步画笔颜色
context.lineWidth = me.brushWidth;//初始画笔大小
context.strokeStyle = me.brushColor;//初始画笔颜色
context.fillStyle = "transparent";//初始画布背景颜色
context.lineCap = "round";//去除锯齿
context.fill();
},
_buildToolbarColor:function (colorList) {
var tmp = null, arr = [];
arr.push("<table id='J_colorList'>");
for (var i = 0, color; color = colorList[i++];) {
if ((i - 1) % 5 == 0) {
if (i != 1) {
arr.push("</tr>");
}
arr.push("<tr>");
}
tmp = '#' + color;
arr.push("<td><a title='" + tmp + "' href='javascript:void(0)' style='background-color:" + tmp + "'></a></td>");
}
arr.push("</tr></table>");
$G("J_colorBar").innerHTML = arr.join("");
},
_addBoardListener:function (saveNum) {
var me = this,
margin = 0,
startX = -1,
startY = -1,
isMouseDown = false,
isMouseMove = false,
isMouseUp = false,
buttonPress = 0, button, flag = '';
margin = parseInt(domUtils.getComputedStyle($G("J_wrap"), "margin-left"));
drawStep.push(context.getImageData(0, 0, context.canvas.width, context.canvas.height));
drawStepIndex += 1;
domUtils.on(canvas, ["mousedown", "mousemove", "mouseup", "mouseout"], function (e) {
button = browser.webkit ? e.which : buttonPress;
switch (e.type) {
case 'mousedown':
buttonPress = 1;
flag = 1;
isMouseDown = true;
isMouseUp = false;
isMouseMove = false;
me.isScrawl = true;
startX = e.clientX - margin;//10为外边距总和
startY = e.clientY - margin;
context.beginPath();
break;
case 'mousemove' :
if (!flag && button == 0) {
return;
}
if (!flag && button) {
startX = e.clientX - margin;//10为外边距总和
startY = e.clientY - margin;
context.beginPath();
flag = 1;
}
if (isMouseUp || !isMouseDown) {
return;
}
var endX = e.clientX - margin,
endY = e.clientY - margin;
context.moveTo(startX, startY);
context.lineTo(endX, endY);
context.stroke();
startX = endX;
startY = endY;
isMouseMove = true;
break;
case 'mouseup':
buttonPress = 0;
if (!isMouseDown)return;
if (!isMouseMove) {
context.arc(startX, startY, context.lineWidth, 0, Math.PI * 2, false);
context.fillStyle = context.strokeStyle;
context.fill();
}
context.closePath();
me._saveOPerate(saveNum);
isMouseDown = false;
isMouseMove = false;
isMouseUp = true;
startX = -1;
startY = -1;
break;
case 'mouseout':
flag = '';
buttonPress = 0;
if (button == 1) return;
context.closePath();
break;
}
});
},
_addOPerateListener:function (saveNum) {
var me = this;
domUtils.on($G("J_previousStep"), "click", function () {
if (drawStepIndex > 1) {
drawStepIndex -= 1;
context.clearRect(0, 0, context.canvas.width, context.canvas.height);
context.putImageData(drawStep[drawStepIndex - 1], 0, 0);
me.btn2Highlight("J_nextStep");
drawStepIndex == 1 && me.btn2disable("J_previousStep");
}
});
domUtils.on($G("J_nextStep"), "click", function () {
if (drawStepIndex > 0 && drawStepIndex < drawStep.length) {
context.clearRect(0, 0, context.canvas.width, context.canvas.height);
context.putImageData(drawStep[drawStepIndex], 0, 0);
drawStepIndex += 1;
me.btn2Highlight("J_previousStep");
drawStepIndex == drawStep.length && me.btn2disable("J_nextStep");
}
});
domUtils.on($G("J_clearBoard"), "click", function () {
context.clearRect(0, 0, context.canvas.width, context.canvas.height);
drawStep = [];
me._saveOPerate(saveNum);
drawStepIndex = 1;
me.isScrawl = false;
me.btn2disable("J_previousStep");
me.btn2disable("J_nextStep");
me.btn2disable("J_clearBoard");
});
},
_addColorBarListener:function () {
var me = this;
domUtils.on($G("J_colorBar"), "click", function (e) {
var target = me.getTarget(e),
color = target.title;
if (!!color) {
me._addColorSelect(target);
me.brushColor = color;
context.globalCompositeOperation = "source-over";
context.lineWidth = me.brushWidth;
context.strokeStyle = color;
}
});
},
_addBrushBarListener:function () {
var me = this;
domUtils.on($G("J_brushBar"), "click", function (e) {
var target = me.getTarget(e),
size = browser.ie ? target.innerText : target.text;
if (!!size) {
me._addBESelect(target);
context.globalCompositeOperation = "source-over";
context.lineWidth = parseInt(size);
context.strokeStyle = me.brushColor;
me.brushWidth = context.lineWidth;
}
});
},
_addEraserBarListener:function () {
var me = this;
domUtils.on($G("J_eraserBar"), "click", function (e) {
var target = me.getTarget(e),
size = browser.ie ? target.innerText : target.text;
if (!!size) {
me._addBESelect(target);
context.lineWidth = parseInt(size);
context.globalCompositeOperation = "destination-out";
context.strokeStyle = "#FFF";
}
});
},
_addAddImgListener:function () {
var file = $G("J_imgTxt");
if (!window.FileReader) {
$G("J_addImg").style.display = 'none';
$G("J_removeImg").style.display = 'none';
$G("J_sacleBoard").style.display = 'none';
}
domUtils.on(file, "change", function (e) {
var frm = file.parentNode;
addMaskLayer(lang.backgroundUploading);
var target = e.target || e.srcElement,
reader = new FileReader();
reader.onload = function(evt){
var target = evt.target || evt.srcElement;
ue_callback(target.result, 'SUCCESS');
};
reader.readAsDataURL(target.files[0]);
frm.reset();
});
},
_addRemoveImgListenter:function () {
var me = this;
domUtils.on($G("J_removeImg"), "click", function () {
$G("J_picBoard").innerHTML = "";
me.btn2disable("J_removeImg");
me.btn2disable("J_sacleBoard");
});
},
_addScalePicListenter:function () {
domUtils.on($G("J_sacleBoard"), "click", function () {
var picBoard = $G("J_picBoard"),
scaleCon = $G("J_scaleCon"),
img = picBoard.children[0];
if (img) {
if (!scaleCon) {
picBoard.style.cssText = "position:relative;z-index:999;"+picBoard.style.cssText;
img.style.cssText = "position: absolute;top:" + (canvas.height - img.height) / 2 + "px;left:" + (canvas.width - img.width) / 2 + "px;";
var scale = new ScaleBoy();
picBoard.appendChild(scale.init());
scale.startScale(img);
} else {
if (scaleCon.style.visibility == "visible") {
scaleCon.style.visibility = "hidden";
picBoard.style.position = "";
picBoard.style.zIndex = "";
} else {
scaleCon.style.visibility = "visible";
picBoard.style.cssText += "position:relative;z-index:999";
}
}
}
});
},
_addClearSelectionListenter:function () {
var doc = document;
domUtils.on(doc, 'mousemove', function (e) {
if (browser.ie && browser.version < 11)
doc.selection.clear();
else
window.getSelection().removeAllRanges();
});
},
_clearSelection:function () {
var list = ["J_operateBar", "J_colorBar", "J_brushBar", "J_eraserBar", "J_picBoard"];
for (var i = 0, group; group = list[i++];) {
domUtils.unSelectable($G(group));
}
},
_saveOPerate:function (saveNum) {
var me = this;
if (drawStep.length <= saveNum) {
if(drawStepIndex<drawStep.length){
me.btn2disable("J_nextStep");
drawStep.splice(drawStepIndex);
}
drawStep.push(context.getImageData(0, 0, context.canvas.width, context.canvas.height));
drawStepIndex = drawStep.length;
} else {
drawStep.shift();
drawStep.push(context.getImageData(0, 0, context.canvas.width, context.canvas.height));
drawStepIndex = drawStep.length;
}
me.btn2Highlight("J_previousStep");
me.btn2Highlight("J_clearBoard");
},
_originalColorSelect:function (title) {
var colorList = $G("J_colorList").getElementsByTagName("td");
for (var j = 0, cell; cell = colorList[j++];) {
if (cell.children[0].title.toLowerCase() == title) {
cell.children[0].style.opacity = 1;
}
}
},
_originalBrushSelect:function (text) {
var brushList = $G("J_brushBar").children;
for (var i = 0, ele; ele = brushList[i++];) {
if (ele.tagName.toLowerCase() == "a") {
var size = browser.ie ? ele.innerText : ele.text;
if (size.toLowerCase() == text) {
ele.style.opacity = 1;
}
}
}
},
_addColorSelect:function (target) {
var me = this,
colorList = $G("J_colorList").getElementsByTagName("td"),
eraserList = $G("J_eraserBar").children,
brushList = $G("J_brushBar").children;
for (var i = 0, cell; cell = colorList[i++];) {
cell.children[0].style.opacity = 0.3;
}
for (var k = 0, ele; ele = brushList[k++];) {
if (ele.tagName.toLowerCase() == "a") {
ele.style.opacity = 0.3;
var size = browser.ie ? ele.innerText : ele.text;
if (size.toLowerCase() == this.brushWidth) {
ele.style.opacity = 1;
}
}
}
for (var j = 0, node; node = eraserList[j++];) {
if (node.tagName.toLowerCase() == "a") {
node.style.opacity = 0.3;
}
}
target.style.opacity = 1;
target.blur();
},
_addBESelect:function (target) {
var brushList = $G("J_brushBar").children;
var eraserList = $G("J_eraserBar").children;
for (var i = 0, ele; ele = brushList[i++];) {
if (ele.tagName.toLowerCase() == "a") {
ele.style.opacity = 0.3;
}
}
for (var j = 0, node; node = eraserList[j++];) {
if (node.tagName.toLowerCase() == "a") {
node.style.opacity = 0.3;
}
}
target.style.opacity = 1;
target.blur();
},
getCanvasData:function () {
var picContainer = $G("J_picBoard"),
img = picContainer.children[0];
if (img) {
var x, y;
if (img.style.position == "absolute") {
x = parseInt(img.style.left);
y = parseInt(img.style.top);
} else {
x = (picContainer.offsetWidth - img.width) / 2;
y = (picContainer.offsetHeight - img.height) / 2;
}
context.globalCompositeOperation = "destination-over";
context.drawImage(img, x, y, img.width, img.height);
} else {
context.globalCompositeOperation = "destination-atop";
context.fillStyle = "#fff";//重置画布背景白色
context.fillRect(0, 0, canvas.width, canvas.height);
}
try {
return canvas.toDataURL("image/png").substring(22);
} catch (e) {
return "";
}
},
btn2Highlight:function (id) {
var cur = $G(id);
cur.className.indexOf("H") == -1 && (cur.className += "H");
},
btn2disable:function (id) {
var cur = $G(id);
cur.className.indexOf("H") != -1 && (cur.className = cur.className.replace("H", ""));
},
getTarget:function (evt) {
return evt.target || evt.srcElement;
}
};
})();
var ScaleBoy = function () {
this.dom = null;
this.scalingElement = null;
};
(function () {
function _appendStyle() {
var doc = document,
head = doc.getElementsByTagName('head')[0],
style = doc.createElement('style'),
cssText = '.scale{visibility:hidden;cursor:move;position:absolute;left:0;top:0;width:100px;height:50px;background-color:#fff;font-size:0;line-height:0;opacity:.4;filter:Alpha(opacity=40);}'
+ '.scale span{position:absolute;left:0;top:0;width:6px;height:6px;background-color:#006DAE;}'
+ '.scale .hand0, .scale .hand7{cursor:nw-resize;}'
+ '.scale .hand1, .scale .hand6{left:50%;margin-left:-3px;cursor:n-resize;}'
+ '.scale .hand2, .scale .hand4, .scale .hand7{left:100%;margin-left:-6px;}'
+ '.scale .hand3, .scale .hand4{top:50%;margin-top:-3px;cursor:w-resize;}'
+ '.scale .hand5, .scale .hand6, .scale .hand7{margin-top:-6px;top:100%;}'
+ '.scale .hand2, .scale .hand5{cursor:ne-resize;}';
style.type = 'text/css';
try {
style.appendChild(doc.createTextNode(cssText));
} catch (e) {
style.styleSheet.cssText = cssText;
}
head.appendChild(style);
}
function _getDom() {
var doc = document,
hand,
arr = [],
scale = doc.createElement('div');
scale.id = 'J_scaleCon';
scale.className = 'scale';
for (var i = 0; i < 8; i++) {
arr.push("<span class='hand" + i + "'></span>");
}
scale.innerHTML = arr.join("");
return scale;
}
var rect = [
//[left, top, width, height]
[1, 1, -1, -1],
[0, 1, 0, -1],
[0, 1, 1, -1],
[1, 0, -1, 0],
[0, 0, 1, 0],
[1, 0, -1, 1],
[0, 0, 0, 1],
[0, 0, 1, 1]
];
ScaleBoy.prototype = {
init:function () {
_appendStyle();
var me = this,
scale = me.dom = _getDom();
me.scaleMousemove.fp = me;
domUtils.on(scale, 'mousedown', function (e) {
var target = e.target || e.srcElement;
me.start = {x:e.clientX, y:e.clientY};
if (target.className.indexOf('hand') != -1) {
me.dir = target.className.replace('hand', '');
}
domUtils.on(document.body, 'mousemove', me.scaleMousemove);
e.stopPropagation ? e.stopPropagation() : e.cancelBubble = true;
});
domUtils.on(document.body, 'mouseup', function (e) {
if (me.start) {
domUtils.un(document.body, 'mousemove', me.scaleMousemove);
if (me.moved) {
me.updateScaledElement({position:{x:scale.style.left, y:scale.style.top}, size:{w:scale.style.width, h:scale.style.height}});
}
delete me.start;
delete me.moved;
delete me.dir;
}
});
return scale;
},
startScale:function (objElement) {
var me = this, Idom = me.dom;
Idom.style.cssText = 'visibility:visible;top:' + objElement.style.top + ';left:' + objElement.style.left + ';width:' + objElement.offsetWidth + 'px;height:' + objElement.offsetHeight + 'px;';
me.scalingElement = objElement;
},
updateScaledElement:function (objStyle) {
var cur = this.scalingElement,
pos = objStyle.position,
size = objStyle.size;
if (pos) {
typeof pos.x != 'undefined' && (cur.style.left = pos.x);
typeof pos.y != 'undefined' && (cur.style.top = pos.y);
}
if (size) {
size.w && (cur.style.width = size.w);
size.h && (cur.style.height = size.h);
}
},
updateStyleByDir:function (dir, offset) {
var me = this,
dom = me.dom, tmp;
rect['def'] = [1, 1, 0, 0];
if (rect[dir][0] != 0) {
tmp = parseInt(dom.style.left) + offset.x;
dom.style.left = me._validScaledProp('left', tmp) + 'px';
}
if (rect[dir][1] != 0) {
tmp = parseInt(dom.style.top) + offset.y;
dom.style.top = me._validScaledProp('top', tmp) + 'px';
}
if (rect[dir][2] != 0) {
tmp = dom.clientWidth + rect[dir][2] * offset.x;
dom.style.width = me._validScaledProp('width', tmp) + 'px';
}
if (rect[dir][3] != 0) {
tmp = dom.clientHeight + rect[dir][3] * offset.y;
dom.style.height = me._validScaledProp('height', tmp) + 'px';
}
if (dir === 'def') {
me.updateScaledElement({position:{x:dom.style.left, y:dom.style.top}});
}
},
scaleMousemove:function (e) {
var me = arguments.callee.fp,
start = me.start,
dir = me.dir || 'def',
offset = {x:e.clientX - start.x, y:e.clientY - start.y};
me.updateStyleByDir(dir, offset);
arguments.callee.fp.start = {x:e.clientX, y:e.clientY};
arguments.callee.fp.moved = 1;
},
_validScaledProp:function (prop, value) {
var ele = this.dom,
wrap = $G("J_picBoard");
value = isNaN(value) ? 0 : value;
switch (prop) {
case 'left':
return value < 0 ? 0 : (value + ele.clientWidth) > wrap.clientWidth ? wrap.clientWidth - ele.clientWidth : value;
case 'top':
return value < 0 ? 0 : (value + ele.clientHeight) > wrap.clientHeight ? wrap.clientHeight - ele.clientHeight : value;
case 'width':
return value <= 0 ? 1 : (value + ele.offsetLeft) > wrap.clientWidth ? wrap.clientWidth - ele.offsetLeft : value;
case 'height':
return value <= 0 ? 1 : (value + ele.offsetTop) > wrap.clientHeight ? wrap.clientHeight - ele.offsetTop : value;
}
}
};
})();
//后台回调
function ue_callback(url, state) {
var doc = document,
picBorard = $G("J_picBoard"),
img = doc.createElement("img");
//图片缩放
function scale(img, max, oWidth, oHeight) {
var width = 0, height = 0, percent, ow = img.width || oWidth, oh = img.height || oHeight;
if (ow > max || oh > max) {
if (ow >= oh) {
if (width = ow - max) {
percent = (width / ow).toFixed(2);
img.height = oh - oh * percent;
img.width = max;
}
} else {
if (height = oh - max) {
percent = (height / oh).toFixed(2);
img.width = ow - ow * percent;
img.height = max;
}
}
}
}
//移除遮罩层
removeMaskLayer();
//状态响应
if (state == "SUCCESS") {
picBorard.innerHTML = "";
img.onload = function () {
scale(this, 300);
picBorard.appendChild(img);
var obj = new scrawl();
obj.btn2Highlight("J_removeImg");
//trace 2457
obj.btn2Highlight("J_sacleBoard");
};
img.src = url;
} else {
alert(state);
}
}
//去掉遮罩层
function removeMaskLayer() {
var maskLayer = $G("J_maskLayer");
maskLayer.className = "maskLayerNull";
maskLayer.innerHTML = "";
dialog.buttons[0].setDisabled(false);
}
//添加遮罩层
function addMaskLayer(html) {
var maskLayer = $G("J_maskLayer");
dialog.buttons[0].setDisabled(true);
maskLayer.className = "maskLayer";
maskLayer.innerHTML = html;
}
//执行确认按钮方法
function exec(scrawlObj) {
if (scrawlObj.isScrawl) {
addMaskLayer(lang.scrawlUpLoading);
var base64 = scrawlObj.getCanvasData();
if (!!base64) {
var options = {
timeout:100000,
onsuccess:function (xhr) {
if (!scrawlObj.isCancelScrawl) {
var responseObj;
responseObj = eval("(" + xhr.responseText + ")");
if (responseObj.state == "SUCCESS") {
var imgObj = {},
url = editor.options.scrawlUrlPrefix + responseObj.url;
imgObj.src = url;
imgObj._src = url;
imgObj.alt = responseObj.original || '';
editor.execCommand("insertImage", imgObj);
dialog.close();
} else {
alert(responseObj.state);
}
}
},
onerror:function () {
alert(lang.imageError);
dialog.close();
}
};
options[editor.getOpt('scrawlFieldName')] = base64;
var actionUrl = editor.getActionUrl(editor.getOpt('scrawlActionName')),
params = utils.serializeParam(editor.queryCommandValue('serverparam')) || '',
url = utils.formatUrl(actionUrl + (actionUrl.indexOf('?') == -1 ? '?':'&') + params);
ajax.request(url, options);
}
} else {
addMaskLayer(lang.noScarwl + "&nbsp;&nbsp;&nbsp;<input type='button' value='" + lang.continueBtn + "' onclick='removeMaskLayer()'/>");
}
}

View File

@@ -0,0 +1,117 @@
<!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?20220503"></script>
<style type="text/css">
.warpper{ position:relative;width: 380px; height: 100%; margin: 10px auto;}
.tabbody{height: 160px;}
.tabbody table{width:100%;border-collapse: separate;border-spacing: 3px;line-height:36px;}
.tabbody .panel{width:373px;height:100%;padding-left: 5px;position: absolute;background-color: #fff;}
.tabbody input.int{ width: 190px;
height: 30px;
border: 1px solid #d7d7d7;
line-height: 21px;
border-radius: 3px;
outline: none;
padding: 0 5px; }
.tabbody input.btn{ text-align: center;
line-height: 28px;
text-decoration: none;
height: 30px;
border: 1px solid #ccc;
background: #FFF;
border-radius: 3px;
padding: 0 5px;
font-size: 12px;
cursor: pointer;}
</style>
</head>
<body>
<div class="warpper" id="searchtab">
<div id="head" class="tabhead">
<span tabsrc="find" class="focus"><var id="lang_tab_search"></var></span>
<span tabsrc="replace" ><var id="lang_tab_replace"></var></span>
</div>
<div class="tabbody">
<div class="panel" id="find">
<table>
<tr>
<td width="80"><var id="lang_search1"></var>: </td>
<td><input id="findtxt" type="text" class="int" /></td>
</tr>
<!--<tr>-->
<!--<td colspan="2"><span style="color:red"><var id="lang_searchReg"></var></span></td>-->
<!--</tr>-->
<tr>
<td><var id="lang_case_sensitive1"></var></td>
<td>
<input id="matchCase" type="checkbox" />
</td>
</tr>
<tr>
<td colspan="2">
<input id="nextFindBtn" type="button" class="btn" />
<input id="preFindBtn" type="button" class="btn" />
</td>
</tr>
<tr>
<td colspan="2">
&nbsp;
</td>
</tr>
<tr>
<td colspan="2">
<span id="search-msg" style="color:red"></span>
</td>
</tr>
</table>
</div>
<div class="panel" id="replace">
<table>
<tr>
<td width="80"><var id="lang_search2"></var>: </td>
<td><input id="findtxt1" type="text" class="int" /></td>
</tr>
<!--<tr>-->
<!--<td colspan="2"><span style="color:red"><var id="lang_searchReg1"></var></span></td>-->
<!--</tr>-->
<tr>
<td><var id="lang_replace"></var>: </td>
<td><input id="replacetxt" type="text" class="int" /></td>
</tr>
<tr>
<td><var id="lang_case_sensitive2"></var></td>
<td>
<input id="matchCase1" type="checkbox" />
</td>
</tr>
<tr>
<td colspan="2">
<input id="nextReplaceBtn" type="button" class="btn" />
<input id="preReplaceBtn" type="button" class="btn" />
<input id="repalceBtn" type="button" class="btn" />
<input id="repalceAllBtn" type="button" class="btn" />
</td>
</tr>
<tr>
<td colspan="2">
&nbsp;
</td>
</tr>
<tr>
<td colspan="2">
<span id="replace-msg" style="color:red"></span>
</td>
</tr>
</table>
</div>
</div>
</div>
<script type="text/javascript" src="searchreplace.js?20220503"></script>
</body>
</html>

View File

@@ -0,0 +1,170 @@
/**
* Created with JetBrains PhpStorm.
* User: xuheng
* Date: 12-9-26
* Time: 下午12:29
* To change this template use File | Settings | File Templates.
*/
//清空上次查选的痕迹
editor.firstForSR = 0;
editor.currentRangeForSR = null;
//给tab注册切换事件
/**
* 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" );
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);
}
}
}
$G('searchtab').onmousedown = function(){
$G('search-msg').innerHTML = '';
$G('replace-msg').innerHTML = ''
}
//是否区分大小写
function getMatchCase(id) {
return $G(id).checked ? true : false;
}
//查找
$G("nextFindBtn").onclick = function (txt, dir, mcase) {
var findtxt = $G("findtxt").value, obj;
if (!findtxt) {
return false;
}
obj = {
searchStr:findtxt,
dir:1,
casesensitive:getMatchCase("matchCase")
};
if (!frCommond(obj)) {
var bk = editor.selection.getRange().createBookmark();
$G('search-msg').innerHTML = lang.getEnd;
editor.selection.getRange().moveToBookmark(bk).select();
}
};
$G("nextReplaceBtn").onclick = function (txt, dir, mcase) {
var findtxt = $G("findtxt1").value, obj;
if (!findtxt) {
return false;
}
obj = {
searchStr:findtxt,
dir:1,
casesensitive:getMatchCase("matchCase1")
};
frCommond(obj);
};
$G("preFindBtn").onclick = function (txt, dir, mcase) {
var findtxt = $G("findtxt").value, obj;
if (!findtxt) {
return false;
}
obj = {
searchStr:findtxt,
dir:-1,
casesensitive:getMatchCase("matchCase")
};
if (!frCommond(obj)) {
$G('search-msg').innerHTML = lang.getStart;
}
};
$G("preReplaceBtn").onclick = function (txt, dir, mcase) {
var findtxt = $G("findtxt1").value, obj;
if (!findtxt) {
return false;
}
obj = {
searchStr:findtxt,
dir:-1,
casesensitive:getMatchCase("matchCase1")
};
frCommond(obj);
};
//替换
$G("repalceBtn").onclick = function () {
editor.trigger('clearLastSearchResult');
var findtxt = $G("findtxt1").value.replace(/^\s|\s$/g, ""), obj,
replacetxt = $G("replacetxt").value.replace(/^\s|\s$/g, "");
if (!findtxt) {
return false;
}
if (findtxt == replacetxt || (!getMatchCase("matchCase1") && findtxt.toLowerCase() == replacetxt.toLowerCase())) {
return false;
}
obj = {
searchStr:findtxt,
dir:1,
casesensitive:getMatchCase("matchCase1"),
replaceStr:replacetxt
};
frCommond(obj);
};
//全部替换
$G("repalceAllBtn").onclick = function () {
var findtxt = $G("findtxt1").value.replace(/^\s|\s$/g, ""), obj,
replacetxt = $G("replacetxt").value.replace(/^\s|\s$/g, "");
if (!findtxt) {
return false;
}
if (findtxt == replacetxt || (!getMatchCase("matchCase1") && findtxt.toLowerCase() == replacetxt.toLowerCase())) {
return false;
}
obj = {
searchStr:findtxt,
casesensitive:getMatchCase("matchCase1"),
replaceStr:replacetxt,
all:true
};
var num = frCommond(obj);
if (num) {
$G('replace-msg').innerHTML = lang.countMsg.replace("{#count}", num);
}
};
//执行
var frCommond = function (obj) {
return editor.execCommand("searchreplace", obj);
};
switchTab("searchtab");
dialog.onclose = function(){
editor.trigger('clearLastSearchResult')
};

View File

@@ -0,0 +1,21 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="../internal.js?20220503"></script>
<style type="text/css">
html,body{overflow:hidden;}
#specharsTab{width: 97%;margin: 10px auto; zoom:1;position: relative}
.tabbody {height:447px;}
.tabbody span{ margin: 5px 3px;text-align: center;display:inline-block;width: 40px;height:16px;line-height: 16px;cursor: pointer; }
</style>
</head>
<body>
<div id="specharsTab">
<div id="tabHeads" class="tabhead"></div><div id="tabBodys" class="tabbody"></div>
</div>
<script type="text/javascript" src="spechars.js?20220503"></script>
</body>
</html>

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