@ -0,0 +1,2 @@
|
||||
> 1%
|
||||
last 2 versions
|
@ -0,0 +1,5 @@
|
||||
[*.{js,jsx,ts,tsx,vue}]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
@ -0,0 +1,17 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
node: true
|
||||
},
|
||||
'extends': [
|
||||
'plugin:vue/essential',
|
||||
'@vue/standard'
|
||||
],
|
||||
rules: {
|
||||
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
|
||||
},
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint'
|
||||
}
|
||||
}
|
@ -0,0 +1,21 @@
|
||||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Log files
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
@ -0,0 +1,23 @@
|
||||
// 项目开发阶段用到的babel插件
|
||||
const prodPlugins = []
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
prodPlugins.push('transform-remove-console')
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
'presets': [
|
||||
'@vue/cli-plugin-babel/preset'
|
||||
],
|
||||
'plugins': [
|
||||
[
|
||||
'component',
|
||||
{
|
||||
'libraryName': 'element-ui',
|
||||
'styleLibraryName': 'theme-chalk'
|
||||
}
|
||||
],
|
||||
// 发布产品时候的插件数组
|
||||
...prodPlugins,
|
||||
'@babel/plugin-syntax-dynamic-import'
|
||||
]
|
||||
}
|
@ -0,0 +1,20 @@
|
||||
{
|
||||
"config_name" : "develop",
|
||||
"jwt_config" : {
|
||||
"secretKey":"itcast",
|
||||
"expiresIn":86400
|
||||
},
|
||||
"upload_config":{
|
||||
"baseURL":"http://127.0.0.1:8888",
|
||||
"upload_ueditor":"uploads/ueditor",
|
||||
"simple_upload_redirect":"http://127.0.0.1/reload"
|
||||
},
|
||||
"db_config" : {
|
||||
"protocol" : "mysql",
|
||||
"host" : "127.0.0.1",
|
||||
"database" : "mydb",
|
||||
"user" : "root",
|
||||
"password" : "root",
|
||||
"port" : 3306
|
||||
}
|
||||
}
|
@ -0,0 +1,21 @@
|
||||
var path = require("path");
|
||||
daoModule = require("./DAO");
|
||||
databaseModule = require(path.join(process.cwd(),"modules/database"));
|
||||
|
||||
/**
|
||||
* 获取参数列表数据
|
||||
*
|
||||
* @param {[type]} cat_id 分类ID
|
||||
* @param {[type]} sel 类型
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.list = function(cat_id,sel,cb) {
|
||||
db = databaseModule.getDatabase();
|
||||
sql = "SELECT * FROM sp_attribute WHERE cat_id = ? AND attr_sel = ? AND delete_time is NULL";
|
||||
database.driver.execQuery(
|
||||
sql
|
||||
,[cat_id,sel],function(err,attributes){
|
||||
if(err) return cb("查询执行出错");
|
||||
cb(null,attributes);
|
||||
});
|
||||
}
|
@ -0,0 +1,224 @@
|
||||
var path = require("path");
|
||||
|
||||
// 获取数据库模型
|
||||
databaseModule = require(path.join(process.cwd(),"modules/database"));
|
||||
var logger = require('../modules/logger').logger();
|
||||
|
||||
/**
|
||||
* 创建对象数据
|
||||
*
|
||||
* @param {[type]} modelName 模型名称
|
||||
* @param {[type]} obj 模型对象
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.create = function(modelName,obj,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
var Model = db.models[modelName];
|
||||
Model.create(obj,cb);
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取所有数据
|
||||
*
|
||||
* @param {[type]} conditions 查询条件
|
||||
* 查询条件统一规范
|
||||
* conditions
|
||||
{
|
||||
"columns" : {
|
||||
字段条件
|
||||
"字段名" : "条件值"
|
||||
},
|
||||
"offset" : "偏移",
|
||||
"omit" : ["字段"],
|
||||
"only" : ["需要字段"],
|
||||
"limit" : "",
|
||||
"order" :[
|
||||
"字段" , A | Z,
|
||||
...
|
||||
]
|
||||
}
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.list = function(modelName,conditions,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
|
||||
var model = db.models[modelName];
|
||||
|
||||
if(!model) return cb("模型不存在",null);
|
||||
|
||||
|
||||
|
||||
if(conditions) {
|
||||
if(conditions["columns"]) {
|
||||
model = model.find(conditions["columns"]);
|
||||
} else {
|
||||
model = model.find();
|
||||
}
|
||||
|
||||
if(conditions["offset"]) {
|
||||
model = model.offset(parseInt(conditions["offset"]));
|
||||
}
|
||||
|
||||
if(conditions["limit"]) {
|
||||
model = model.limit(parseInt(conditions["limit"]));
|
||||
}
|
||||
|
||||
if(conditions["only"]) {
|
||||
model = model.only(conditions["only"]);
|
||||
}
|
||||
|
||||
if(conditions["omit"]) {
|
||||
model = model.omit(conditions["omit"]);
|
||||
}
|
||||
|
||||
if(conditions["order"]) {
|
||||
model = model.order(conditions["order"]);
|
||||
}
|
||||
|
||||
} else {
|
||||
model = model.find();
|
||||
}
|
||||
|
||||
model.run(function(err,models) {
|
||||
|
||||
if(err) {
|
||||
console.log(err);
|
||||
return cb("查询失败",null);
|
||||
}
|
||||
cb(null,models);
|
||||
});
|
||||
};
|
||||
|
||||
module.exports.countByConditions = function(modelName,conditions,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
|
||||
var model = db.models[modelName];
|
||||
|
||||
if(!model) return cb("模型不存在",null);
|
||||
|
||||
var resultCB = function(err,count){
|
||||
if(err) {
|
||||
return cb("查询失败",null);
|
||||
}
|
||||
cb(null,count);
|
||||
}
|
||||
|
||||
if(conditions) {
|
||||
if(conditions["columns"]) {
|
||||
model = model.count(conditions["columns"],resultCB);
|
||||
} else {
|
||||
model = model.count(resultCB);
|
||||
}
|
||||
|
||||
} else {
|
||||
model = model.count(resultCB);
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取一条数据
|
||||
* @param {[type]} modelName 模型名称
|
||||
* @param {[数组]} conditions 条件集合
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.findOne = function(modelName,conditions,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
|
||||
var Model = db.models[modelName];
|
||||
|
||||
if(!Model) return cb("模型不存在",null);
|
||||
|
||||
if(!conditions) return cb("条件为空",null);
|
||||
|
||||
Model.one(conditions,function(err,obj){
|
||||
logger.debug(err);
|
||||
if(err) {
|
||||
return cb("查询失败",null);
|
||||
}
|
||||
return cb(null,obj);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新对象数据
|
||||
*
|
||||
* @param {[type]} modelName 模型名称
|
||||
* @param {[type]} id 数据关键ID
|
||||
* @param {[type]} updateObj 更新对象数据
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.update = function(modelName,id,updateObj,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
var Model = db.models[modelName];
|
||||
Model.get(id,function(err,obj){
|
||||
if(err) return cb("更新失败",null);
|
||||
obj.save(updateObj,cb);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 通过主键ID获取对象
|
||||
* @param {[type]} modelName 模型名称
|
||||
* @param {[type]} id 主键ID
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.show = function(modelName,id,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
var Model = db.models[modelName];
|
||||
Model.get(id,function(err,obj){
|
||||
cb(err,obj);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 通过主键ID删除对象
|
||||
*
|
||||
* @param {[type]} modelName 模型名称
|
||||
* @param {[type]} id 主键ID
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.destroy = function(modelName,id,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
var Model = db.models[modelName];
|
||||
Model.get(id,function(err,obj){
|
||||
if(err) return cb("无模型ID");
|
||||
obj.remove(function(err) {
|
||||
if(err) return cb("删除失败");
|
||||
return cb(null);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 通过模型名称获取数据库数量
|
||||
*
|
||||
* @param {[type]} modelName 模型名称
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.count = function(modelName,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
var Model = db.models[modelName];
|
||||
Model.count(cb);
|
||||
}
|
||||
|
||||
/**
|
||||
* 通过条件判断数据是否存在
|
||||
*
|
||||
* @param {[type]} modelName 模块名
|
||||
* @param {[type]} conditions 条件
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.exists = function(modelName,conditions,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
var Model = db.models[modelName];
|
||||
Model.exists(conditions,function(err,isExists){
|
||||
if(err) return cb("查询失败");
|
||||
cb(null,isExists);
|
||||
});
|
||||
}
|
||||
|
||||
module.exports.getModel = function(modelName) {
|
||||
var db = databaseModule.getDatabase();
|
||||
return db.models[modelName];
|
||||
}
|
@ -0,0 +1,26 @@
|
||||
var path = require("path");
|
||||
daoModule = require("./DAO");
|
||||
databaseModule = require(path.join(process.cwd(),"modules/database"));
|
||||
|
||||
|
||||
module.exports.clearGoodAttributes = function(goods_id,cb) {
|
||||
db = databaseModule.getDatabase();
|
||||
sql = "DELETE FROM sp_goods_attr WHERE goods_id = ?";
|
||||
database.driver.execQuery(
|
||||
sql
|
||||
,[goods_id],function(err){
|
||||
if(err) return cb("删除出错");
|
||||
cb(null);
|
||||
});
|
||||
}
|
||||
|
||||
module.exports.list = function(goods_id,cb) {
|
||||
db = databaseModule.getDatabase();
|
||||
sql = "SELECT good_attr.goods_id,good_attr.attr_id,good_attr.attr_value,good_attr.add_price,attr.attr_name,attr.attr_sel,attr.attr_write,attr.attr_vals FROM sp_goods_attr as good_attr LEFT JOIN sp_attribute as attr ON attr.attr_id = good_attr.attr_id WHERE good_attr.goods_id = ?";
|
||||
database.driver.execQuery(
|
||||
sql
|
||||
,[goods_id],function(err,attrs){
|
||||
if(err) return cb("删除出错");
|
||||
cb(null,attrs);
|
||||
});
|
||||
}
|
@ -0,0 +1,165 @@
|
||||
var path = require("path");
|
||||
daoModule = require("./DAO");
|
||||
databaseModule = require(path.join(process.cwd(),"modules/database"));
|
||||
|
||||
/**
|
||||
* 创建管理员
|
||||
*
|
||||
* @param {[type]} obj 管理员信息
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.create = function(obj,cb) {
|
||||
daoModule.create("ManagerModel",obj,cb);
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取管理员列表
|
||||
*
|
||||
* @param {[type]} conditions 查询条件
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.list = function(conditions,cb) {
|
||||
daoModule.list("ManagerModel",conditions,function(err,models) {
|
||||
if(err) return cb(err,null);
|
||||
cb(null,models);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 通过查询条件获取管理员对象
|
||||
*
|
||||
* @param {[type]} conditions 条件
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.findOne = function(conditions,cb) {
|
||||
daoModule.findOne("ManagerModel",conditions,cb);
|
||||
}
|
||||
|
||||
/**
|
||||
* 通过关键词查询用户
|
||||
*
|
||||
* @param {[type]} key 关键词
|
||||
* @param {[type]} offset
|
||||
* @param {[type]} limit
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.findByKey = function(key,offset,limit,cb) {
|
||||
db = databaseModule.getDatabase();
|
||||
sql = "SELECT * FROM sp_manager as mgr LEFT JOIN sp_role as role ON mgr.role_id = role.role_id";
|
||||
|
||||
if(key) {
|
||||
sql += " WHERE mg_name LIKE ? LIMIT ?,?";
|
||||
database.driver.execQuery(
|
||||
sql
|
||||
,["%" + key + "%",offset,limit],function(err,managers){
|
||||
if(err) return cb("查询执行出错");
|
||||
cb(null,managers);
|
||||
});
|
||||
} else {
|
||||
sql += " LIMIT ?,? ";
|
||||
database.driver.execQuery(sql,[offset,limit],function(err,managers){
|
||||
if(err) return cb("查询执行出错");
|
||||
cb(null,managers);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 判断是否存在管理员
|
||||
*
|
||||
* @param {[type]} username 用户名
|
||||
* @param {Function} cb 回调函数
|
||||
*
|
||||
*/
|
||||
module.exports.exists = function(username,cb) {
|
||||
var db = databaseModule.getDatabase();
|
||||
var Model = db.models.ManagerModel;
|
||||
Model.exists({"mg_name":username},function(err,isExists){
|
||||
if(err) return cb("查询失败");
|
||||
cb(null,isExists);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 模糊查询用户数量
|
||||
*
|
||||
* @param {[type]} key 关键词
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.countByKey = function(key,cb) {
|
||||
db = databaseModule.getDatabase();
|
||||
sql = "SELECT count(*) as count FROM sp_manager";
|
||||
if(key) {
|
||||
sql += " WHERE mg_name LIKE ?";
|
||||
database.driver.execQuery(
|
||||
sql
|
||||
,["%" + key + "%"],function(err,result){
|
||||
if(err) return cb("查询执行出错");
|
||||
cb(null,result[0]["count"]);
|
||||
});
|
||||
} else {
|
||||
database.driver.execQuery(sql,function(err,result){
|
||||
if(err) return cb("查询执行出错");
|
||||
cb(null,result[0]["count"]);
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* 通过ID获取管理员对象数据
|
||||
*
|
||||
* @param {[type]} id 管理员主键ID
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.show = function(id,cb) {
|
||||
daoModule.show("ManagerModel",id,cb);
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新管理员信息
|
||||
*
|
||||
* @param {[type]} obj 管理员对象
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.update = function(obj,cb) {
|
||||
daoModule.update("ManagerModel",obj.mg_id,obj,cb);
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除管理员对象数据
|
||||
*
|
||||
* @param {[type]} id 主键ID
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.destroy = function(id,cb) {
|
||||
daoModule.destroy("ManagerModel",id,function(err){
|
||||
if(err) return cb(err);
|
||||
return cb(null);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 保存管理员信息
|
||||
*
|
||||
* @param {[type]} obj 管理员对象
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.save = function(obj,cb) {
|
||||
daoModule.show(obj.mg_id,function(err,oldObj){
|
||||
if(err) {
|
||||
daoModule.create("ManagerModel",obj,cb);
|
||||
} else {
|
||||
daoModule.update("ManagerModel",obj.mg_id,obj,cb);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取管理员数量
|
||||
*
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.count = function(cb) {
|
||||
daoModule("ManagerModel",cb);
|
||||
}
|
@ -0,0 +1,50 @@
|
||||
var path = require("path");
|
||||
daoModule = require("./DAO");
|
||||
databaseModule = require(path.join(process.cwd(),"modules/database"));
|
||||
|
||||
/**
|
||||
* 获取权限列表
|
||||
*
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.list = function(cb) {
|
||||
db = databaseModule.getDatabase();
|
||||
sql = "SELECT * FROM sp_permission_api as api LEFT JOIN sp_permission as main ON main.ps_id = api.ps_id WHERE main.ps_id is not null";
|
||||
database.driver.execQuery(sql,function(err,result){
|
||||
if(err) return cb("获取权限列表失败",null);
|
||||
cb(null,result);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 权限验证
|
||||
*
|
||||
* @param {[type]} rid 角色ID
|
||||
* @param {[type]} serviceName 服务名
|
||||
* @param {[type]} actionName 动作名
|
||||
* @param {Function} cb 回调函数
|
||||
*/
|
||||
module.exports.authRight = function(rid,serviceName,actionName,cb) {
|
||||
|
||||
// 超级管理员
|
||||
if(rid == 0) return cb(null,true);
|
||||
|
||||
// 权限验证
|
||||
daoModule.findOne("PermissionAPIModel",{"ps_api_service":serviceName,"ps_api_action":actionName},function(err,permissionAPI){
|
||||
console.log("rid => %s,serviceName => %s,actionName => %s",rid,serviceName,actionName);
|
||||
if(err || !permissionAPI) return cb("无权限访问",false);
|
||||
|
||||
daoModule.findOne("RoleModel",{"role_id":rid},function(err,role){
|
||||
console.log(role);
|
||||
if(err || !role) return cb("获取角色信息失败",false);
|
||||
ps_ids = role.ps_ids.split(",");
|
||||
for(idx in ps_ids) {
|
||||
ps_id = ps_ids[idx];
|
||||
if(parseInt(permissionAPI.ps_id) == parseInt(ps_id)) {
|
||||
return cb(null,true);
|
||||
}
|
||||
}
|
||||
return cb("无权限访问",false);
|
||||
});
|
||||
});
|
||||
}
|
After Width: | Height: | Size: 255 KiB |
After Width: | Height: | Size: 250 KiB |
After Width: | Height: | Size: 298 KiB |
After Width: | Height: | Size: 329 KiB |
After Width: | Height: | Size: 337 KiB |
After Width: | Height: | Size: 503 KiB |
After Width: | Height: | Size: 191 KiB |
After Width: | Height: | Size: 18 KiB |
After Width: | Height: | Size: 25 KiB |
After Width: | Height: | Size: 85 KiB |
After Width: | Height: | Size: 26 KiB |
After Width: | Height: | Size: 19 KiB |
After Width: | Height: | Size: 13 KiB |
After Width: | Height: | Size: 462 KiB |
After Width: | Height: | Size: 282 KiB |
After Width: | Height: | Size: 426 KiB |
After Width: | Height: | Size: 272 KiB |
After Width: | Height: | Size: 297 KiB |
After Width: | Height: | Size: 175 KiB |
@ -0,0 +1,15 @@
|
||||
module.exports = function(db,callback){
|
||||
// 用户模型
|
||||
db.define("AttributeModel",{
|
||||
attr_id : {type: 'serial', key: true},
|
||||
attr_name : String,
|
||||
cat_id : Number,
|
||||
attr_sel : ["only", "many"], // only:输入框(唯一) many:后台下拉列表/前台单选框
|
||||
attr_write: ["manual","list"], // manual:手工录入 list:从列表选择
|
||||
attr_vals: String,
|
||||
delete_time : Number
|
||||
},{
|
||||
table : "sp_attribute"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,13 @@
|
||||
module.exports = function(db,callback){
|
||||
// 用户模型
|
||||
db.define("CategoryModel",{
|
||||
cat_id : {type: 'serial', key: true},
|
||||
cat_name : String,
|
||||
cat_pid : Number,
|
||||
cat_level : Number,
|
||||
cat_deleted: Boolean
|
||||
},{
|
||||
table : "sp_category"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,13 @@
|
||||
module.exports = function(db,callback){
|
||||
// 用户模型
|
||||
db.define("GoodAttributeModel",{
|
||||
id : {type: 'serial', key: true},
|
||||
goods_id : Number,
|
||||
attr_id : Number,
|
||||
attr_value : String,
|
||||
add_price : Number
|
||||
},{
|
||||
table : "sp_goods_attr"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,13 @@
|
||||
module.exports = function(db,callback){
|
||||
// 用户模型
|
||||
db.define("GoodPicModel",{
|
||||
pics_id : {type: 'serial', key: true},
|
||||
goods_id : Number,
|
||||
pics_big : String,
|
||||
pics_mid : String,
|
||||
pics_sma : String
|
||||
},{
|
||||
table : "sp_goods_pics"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,16 @@
|
||||
module.exports = function(db,callback){
|
||||
// 用户模型
|
||||
db.define("ManagerModel",{
|
||||
mg_id : {type: 'serial', key: true},
|
||||
mg_name : String,
|
||||
mg_pwd : String,
|
||||
mg_time : Number,
|
||||
role_id : Number,
|
||||
mg_mobile : String,
|
||||
mg_email : String,
|
||||
mg_state : Number
|
||||
},{
|
||||
table : "sp_manager"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,14 @@
|
||||
module.exports = function(db,callback){
|
||||
// 用户模型
|
||||
db.define("OrderGoodModel",{
|
||||
id : {type: 'serial', key: true},
|
||||
order_id : Number,
|
||||
goods_id : Number,
|
||||
goods_price : Number,
|
||||
goods_number : Number,
|
||||
goods_total_price : Number
|
||||
},{
|
||||
table : "sp_order_goods"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,22 @@
|
||||
module.exports = function(db,callback){
|
||||
// 用户模型
|
||||
db.define("OrderModel",{
|
||||
order_id : {type: 'serial', key: true},
|
||||
user_id : Number,
|
||||
order_number : String,
|
||||
order_price : Number,
|
||||
order_pay : [1,2,3],
|
||||
is_send : ["是","否"],
|
||||
trade_no : String,
|
||||
order_fapiao_title : ["个人","公司"],
|
||||
order_fapiao_company : String,
|
||||
order_fapiao_content : String,
|
||||
consignee_addr : String,
|
||||
pay_status : ['0','1'],
|
||||
create_time : Number,
|
||||
update_time : Number
|
||||
},{
|
||||
table : "sp_order"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,14 @@
|
||||
module.exports = function(db,callback) {
|
||||
// 用户模型
|
||||
db.define("PermissionAPIModel",{
|
||||
id : {type: 'serial', key: true},
|
||||
ps_id : Number,
|
||||
ps_api_service : String,
|
||||
ps_api_action : String,
|
||||
ps_api_order : Number
|
||||
|
||||
},{
|
||||
table : "sp_permission_api"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,14 @@
|
||||
module.exports = function(db,callback){
|
||||
// 用户模型
|
||||
db.define("PermissionModel",{
|
||||
ps_id : {type: 'serial', key: true},
|
||||
ps_name : String,
|
||||
ps_pid : Number,
|
||||
ps_c : String,
|
||||
ps_a : String,
|
||||
ps_level : String
|
||||
},{
|
||||
table : "sp_permission"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,12 @@
|
||||
module.exports = function(db,callback){
|
||||
// 报表模型1
|
||||
db.define("ReportOneModel",{
|
||||
id : {type: 'serial', key: true},
|
||||
rp1_user_count : Number,
|
||||
rp1_area : Number,
|
||||
rp1_date : { type: "date", time: false }
|
||||
},{
|
||||
table : "sp_report_1"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,12 @@
|
||||
module.exports = function(db,callback){
|
||||
// 报表模型1
|
||||
db.define("ReportTwoModel",{
|
||||
id : {type: 'serial', key: true},
|
||||
rp2_page : String,
|
||||
rp2_count : Number,
|
||||
rp2_date : { type: "date", time: false }
|
||||
},{
|
||||
table : "sp_report_2"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,13 @@
|
||||
module.exports = function(db,callback){
|
||||
// 用户模型
|
||||
db.define("RoleModel",{
|
||||
role_id : {type: 'serial', key: true},
|
||||
role_name : String,
|
||||
ps_ids : String,
|
||||
ps_ca : String,
|
||||
role_desc : String
|
||||
},{
|
||||
table : "sp_role"
|
||||
});
|
||||
return callback();
|
||||
}
|
@ -0,0 +1,54 @@
|
||||
// 导入 request 模块
|
||||
const request = require('request')
|
||||
|
||||
// 自动匹配运单号所属的物流公司
|
||||
function autoComNumber(orderno) {
|
||||
const url = `https://www.kuaidi100.com/autonumber/autoComNum?resultv2=1&text=${orderno}`
|
||||
return new Promise(function(resolve, reject) {
|
||||
request(url, (err, response, body) => {
|
||||
if (err) return reject({ status: 500, msg: err.message })
|
||||
// resolve(body)
|
||||
// console.log(body.num)
|
||||
body = JSON.parse(body)
|
||||
if (body.auto.length <= 0) return reject({ status: 501, msg: '无对应的物流公司' })
|
||||
resolve({ status: 200, msg: body.auto[0], comCode: body.auto[0].comCode })
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
async function getLogisticsInfo(req, res) {
|
||||
const result = await autoComNumber(req.params.orderno)
|
||||
|
||||
if (result.status !== 200) {
|
||||
return {
|
||||
meta: {
|
||||
status: 500,
|
||||
message: '获取物流信息失败!'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const dataUrl = `https://www.kuaidi100.com/query?type=${result.comCode}&postid=${req.params.orderno}&temp=0.2595247267684455`
|
||||
request(dataUrl, (err, response, body) => {
|
||||
if (err) {
|
||||
return res.send({
|
||||
meta: {
|
||||
status: 501,
|
||||
message: '获取物流信息失败!'
|
||||
}
|
||||
})
|
||||
}
|
||||
// 获取物流信息成功
|
||||
return res.send({
|
||||
meta: {
|
||||
status: 200,
|
||||
message: '获取物流信息成功!'
|
||||
},
|
||||
data: (JSON.parse(body)).data
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
getLogisticsInfo
|
||||
}
|
@ -0,0 +1,77 @@
|
||||
require('mysql');
|
||||
var fs = require("fs");
|
||||
var orm = require("orm");
|
||||
var Promise = require("bluebird");
|
||||
var path = require("path");
|
||||
|
||||
/*
|
||||
app: 应用程序环境
|
||||
config: 数据库配置
|
||||
callback: 回调
|
||||
*/
|
||||
function initialize(app,callback) {
|
||||
|
||||
// 加载配置文件
|
||||
var config = require('config').get("db_config");
|
||||
|
||||
// 从配置中获取数据库配置
|
||||
var opts = {
|
||||
protocol : config.get("protocol"),
|
||||
host : config.get("host"),
|
||||
database : config.get("database"),
|
||||
port : config.get("port"),
|
||||
user : config.get("user"),
|
||||
password : config.get("password"),
|
||||
query : {pool: true,debug: true}
|
||||
};
|
||||
|
||||
|
||||
console.log("数据库连接参数 %s",JSON.stringify(opts));
|
||||
|
||||
// 初始化ORM模型
|
||||
app.use(orm.express(opts, {
|
||||
define: function (db, models, next) {
|
||||
|
||||
app.db = db;
|
||||
global.database = db;
|
||||
|
||||
// 获取映射文件路径
|
||||
var modelsPath = path.join(process.cwd(),"/models");
|
||||
|
||||
// 读取所有模型文件
|
||||
fs.readdir(modelsPath,function(err, files) {
|
||||
// 存放所有的加载模型函数
|
||||
var loadModelAsynFns = new Array();
|
||||
// console.log("开始加载 ORM 模型层文件 ");
|
||||
for (var i = 0; i < files.length; i++) {
|
||||
var modelPath = modelsPath + "/" +files[i];
|
||||
// console.log("加载模型 %s",modelPath);
|
||||
loadModelAsynFns[i] = db.loadAsync(modelPath);
|
||||
}
|
||||
|
||||
Promise.all(loadModelAsynFns)
|
||||
.then(function(){
|
||||
// console.log("ORM 模型加载完成");
|
||||
// 挂载模型集合
|
||||
|
||||
for(var modelName in db.models){
|
||||
models[modelName] = db.models[modelName];
|
||||
}
|
||||
app.models = models;
|
||||
callback(null);
|
||||
next();
|
||||
})
|
||||
.catch(function(error){
|
||||
console.error('加载模块出错 error: ' + err);
|
||||
callback(error);
|
||||
next();
|
||||
});
|
||||
});
|
||||
}
|
||||
}));
|
||||
}
|
||||
|
||||
module.exports.initialize = initialize;
|
||||
module.exports.getDatabase = function() {
|
||||
return global.database;
|
||||
}
|
@ -0,0 +1,20 @@
|
||||
var log4js = require('log4js');
|
||||
|
||||
log4js.configure({
|
||||
appenders: { cheese: { type: 'file', filename: 'cheese.log' } },
|
||||
categories: { default: { appenders: ['cheese'], level: 'error' } }
|
||||
});
|
||||
|
||||
exports.logger = function (level) {
|
||||
var logger = log4js.getLogger("cheese");
|
||||
logger.level = 'debug';
|
||||
return logger;
|
||||
};
|
||||
|
||||
// 配合 express 使用的方法
|
||||
// exports.use = function (app, level) {
|
||||
// app.use(log4js.connectLogger(log4js.getLogger('logInfo'), {
|
||||
// level: levels[level] || levels['debug'],
|
||||
// format: ':method :url :status'
|
||||
// }));
|
||||
// };
|
@ -0,0 +1,86 @@
|
||||
const passport = require('passport');
|
||||
const LocalStrategy = require('passport-local').Strategy;
|
||||
const Strategy = require('passport-http-bearer').Strategy;
|
||||
|
||||
var jwt = require("jsonwebtoken");
|
||||
|
||||
var _ = require('lodash');
|
||||
|
||||
var jwt_config = require("config").get("jwt_config");
|
||||
|
||||
// 通过登录函数初始化
|
||||
/**
|
||||
* 初始化 passport 框架
|
||||
*
|
||||
* @param {[type]} app 全局应用程序
|
||||
* @param {[type]} loginFunc 登录函数
|
||||
* @param {Function} callback 回调函数
|
||||
*/
|
||||
module.exports.setup = function(app,loginFunc,callback) {
|
||||
// 用户名密码 登录策略
|
||||
passport.use(new LocalStrategy(
|
||||
function(username, password, done) {
|
||||
if(!loginFunc) return done("登录验证函数未设置");
|
||||
|
||||
loginFunc(username,password,function(err,user) {
|
||||
if(err) return done(err);
|
||||
return done(null, user);
|
||||
});
|
||||
})
|
||||
);
|
||||
|
||||
// token 验证策略
|
||||
passport.use(new Strategy(
|
||||
function(token, done) {
|
||||
jwt.verify(token, jwt_config.get("secretKey"), function (err, decode) {
|
||||
if (err) { return done("验证错误"); }
|
||||
return done(null, decode);
|
||||
});
|
||||
}
|
||||
));
|
||||
|
||||
// 初始化passport模块
|
||||
app.use(passport.initialize());
|
||||
|
||||
if(callback) callback();
|
||||
};
|
||||
|
||||
/**
|
||||
* 登录验证逻辑
|
||||
*
|
||||
* @param {[type]} req 请求
|
||||
* @param {[type]} res 响应
|
||||
* @param {Function} next [description]
|
||||
*/
|
||||
module.exports.login = function(req,res,next) {
|
||||
|
||||
passport.authenticate('local', function(err, user, info) {
|
||||
|
||||
if(err) return res.sendResult(null,400,err);
|
||||
if(!user) return res.sendResult(null,400,"参数错误");
|
||||
|
||||
// 获取角色信息
|
||||
var token = jwt.sign({"uid":user.id,"rid":user.rid}, jwt_config.get("secretKey"), {"expiresIn": jwt_config.get("expiresIn")});
|
||||
user.token = "Bearer " + token;
|
||||
return res.sendResult(user,200,'登录成功');
|
||||
})(req, res, next);
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* token验证函数
|
||||
*
|
||||
* @param {[type]} req 请求对象
|
||||
* @param {[type]} res 响应对象
|
||||
* @param {Function} next 传递事件函数
|
||||
*/
|
||||
module.exports.tokenAuth = function(req,res,next) {
|
||||
passport.authenticate('bearer', { session: false },function(err,tokenData) {
|
||||
if(err) return res.sendResult(null,400,'无效token');
|
||||
if(!tokenData) return res.sendResult(null,400,'无效token');
|
||||
req.userInfo = {};
|
||||
req.userInfo.uid = tokenData["uid"];
|
||||
req.userInfo.rid = tokenData["rid"];
|
||||
next();
|
||||
})(req, res, next);
|
||||
}
|
@ -0,0 +1,17 @@
|
||||
// 添加统一的返回结果方法
|
||||
module.exports = function(req, res, next){
|
||||
res.sendResult = function(data,code,message) {
|
||||
var fmt = req.query.fmt ? req.query.fmt : "rest";
|
||||
if(fmt == "rest") {
|
||||
res.json(
|
||||
{
|
||||
"data" : data,
|
||||
"meta" : {
|
||||
"msg" : message,
|
||||
"status" : code
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
next();
|
||||
}
|
@ -0,0 +1,67 @@
|
||||
var _ = require('lodash');
|
||||
var path = require("path");
|
||||
var Busboy = require('busboy');
|
||||
var fs = require("fs");
|
||||
var uniqid = require('uniqid');
|
||||
var ueditor_config = require(path.join(process.cwd(),"/config/ueditor.config.js"));
|
||||
var upload_config = require('config').get("upload_config");
|
||||
|
||||
var filetype = 'jpg,png,gif,ico,bmp';
|
||||
module.exports = function(req,res,next) {
|
||||
|
||||
if(req.query.action == "config") {
|
||||
// 吐给客户端配置信息
|
||||
res.jsonp(ueditor_config);
|
||||
} else if (req.query.action === 'uploadimage' || req.query.action === 'uploadfile' || req.query.action === 'uploadvideo') {
|
||||
var busboy = new Busboy({ headers: req.headers });
|
||||
busboy.on('file', function (fieldname, file, filename, encoding, mimetype) {
|
||||
var fileExtArray = filename.split(".");
|
||||
var ext = fileExtArray[fileExtArray.length - 1];
|
||||
var save_filename = uniqid() + "." + ext;
|
||||
var savePath = path.join(process.cwd(),upload_config.get("upload_ueditor"),save_filename);
|
||||
file.on('end', function () {
|
||||
var result = {
|
||||
'url': upload_config.get("baseURL")+"/" + upload_config.get("upload_ueditor") + "/" + save_filename,
|
||||
'title': req.body && req.body.pictitle || filename,
|
||||
'original': filename,
|
||||
'state': 'SUCCESS'
|
||||
};
|
||||
if(req.query.encode) {
|
||||
res.jsonp(result);
|
||||
} else {
|
||||
|
||||
res.redirect(upload_config.get("simple_upload_redirect") + "?result=" + JSON.stringify(result));
|
||||
// res.redirect(result.url);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
file.pipe(fs.createWriteStream(savePath));
|
||||
});
|
||||
req.pipe(busboy);
|
||||
} else if(req.query.action === 'listimage') {
|
||||
fs.readdir(path.join(process.cwd(),upload_config.get("upload_ueditor")),function(err, files){
|
||||
if(err) return res.end();
|
||||
var total = files.length;
|
||||
|
||||
var filelist = [];
|
||||
var total = 0;
|
||||
_(files).forEach(function(file){
|
||||
var fileExtArray = file.split(".");
|
||||
var ext = fileExtArray[fileExtArray.length - 1];
|
||||
if (filetype.indexOf(ext.toLowerCase()) >= 0) {
|
||||
var result_file = {};
|
||||
result_file.url = upload_config.get("baseURL")+"/" + upload_config.get("upload_ueditor") + "/" + file;
|
||||
filelist.push(result_file);
|
||||
total ++;
|
||||
}
|
||||
});
|
||||
res.jsonp({
|
||||
"state": "SUCCESS",
|
||||
"list": filelist,
|
||||
"start": 1,
|
||||
"total": total
|
||||
});
|
||||
})
|
||||
}
|
||||
}
|
@ -0,0 +1,38 @@
|
||||
{
|
||||
"name": "vue_shop_admin",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build",
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.19.1",
|
||||
"babel-plugin-transform-remove-console": "^6.9.4",
|
||||
"core-js": "^3.4.4",
|
||||
"echarts": "^4.6.0",
|
||||
"element-ui": "^2.4.5",
|
||||
"lodash": "^4.17.15",
|
||||
"nprogress": "^0.2.0",
|
||||
"vue": "^2.6.10",
|
||||
"vue-quill-editor": "^3.0.6",
|
||||
"vue-router": "^3.1.3",
|
||||
"vue-table-with-tree-grid": "^0.2.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
|
||||
"@vue/cli-plugin-babel": "^4.1.0",
|
||||
"@vue/cli-plugin-eslint": "^4.1.0",
|
||||
"@vue/cli-service": "^4.1.0",
|
||||
"@vue/eslint-config-standard": "^4.0.0",
|
||||
"babel-eslint": "^10.0.3",
|
||||
"babel-plugin-component": "^1.1.1",
|
||||
"eslint": "^5.16.0",
|
||||
"eslint-plugin-vue": "^5.0.0",
|
||||
"less": "^3.10.3",
|
||||
"less-loader": "^5.0.0",
|
||||
"vue-cli-plugin-element": "^1.0.1",
|
||||
"vue-template-compiler": "^2.6.10"
|
||||
}
|
||||
}
|
After Width: | Height: | Size: 4.2 KiB |
@ -0,0 +1,44 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title><%= htmlWebpackPlugin.options.isProd ? '' : 'dev - ' %>电商后台管理系统</title>
|
||||
|
||||
<% if(htmlWebpackPlugin.options.isProd){ %>
|
||||
<!-- nprogress 的样式表文件 -->
|
||||
<link rel="stylesheet" href="https://cdn.staticfile.org/nprogress/0.2.0/nprogress.min.css" />
|
||||
<!-- 富文本编辑器 的样式表文件 -->
|
||||
<link rel="stylesheet" href="https://cdn.staticfile.org/quill/1.3.4/quill.core.min.css" />
|
||||
<link rel="stylesheet" href="https://cdn.staticfile.org/quill/1.3.4/quill.snow.min.css" />
|
||||
<link rel="stylesheet" href="https://cdn.staticfile.org/quill/1.3.4/quill.bubble.min.css" />
|
||||
<!-- element-ui 的样式表文件 -->
|
||||
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
|
||||
|
||||
<script src="https://cdn.staticfile.org/vue/2.5.22/vue.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/vue-router/3.0.1/vue-router.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/lodash.js/4.17.11/lodash.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/echarts/4.1.0/echarts.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/nprogress/0.2.0/nprogress.min.js"></script>
|
||||
<!-- 富文本编辑器的 js 文件 -->
|
||||
<script src="https://cdn.staticfile.org/quill/1.3.4/quill.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue-quill-editor@3.0.4/dist/vue-quill-editor.js"></script>
|
||||
|
||||
<!-- element-ui 的 js 文件 -->
|
||||
<script src="https://cdn.staticfile.org/element-ui/2.8.2/index.js"></script>
|
||||
|
||||
|
||||
<% } %>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but vue_shop_admin doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
||||
</noscript>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,40 @@
|
||||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||
"http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title></title>
|
||||
<style type="text/css">
|
||||
*{color: #838383;margin: 0;padding: 0}
|
||||
html,body {font-size: 12px;overflow: hidden; }
|
||||
.content{padding:5px 0 0 15px;}
|
||||
input{width:210px;height:21px;line-height:21px;margin-left: 4px;}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<span><var id="lang_input_anchorName"></var></span><input id="anchorName" value="" />
|
||||
</div>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<script type="text/javascript">
|
||||
var anchorInput = $G('anchorName'),
|
||||
node = editor.selection.getRange().getClosedNode();
|
||||
if(node && node.tagName == 'IMG' && (node = node.getAttribute('anchorname'))){
|
||||
anchorInput.value = node;
|
||||
}
|
||||
anchorInput.onkeydown = function(evt){
|
||||
evt = evt || window.event;
|
||||
if(evt.keyCode == 13){
|
||||
editor.execCommand('anchor', anchorInput.value);
|
||||
dialog.close();
|
||||
domUtils.preventDefault(evt)
|
||||
}
|
||||
};
|
||||
dialog.onok = function (){
|
||||
editor.execCommand('anchor', anchorInput.value);
|
||||
dialog.close();
|
||||
};
|
||||
$focus(anchorInput);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
@ -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;
|
||||
}
|
@ -0,0 +1,60 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>ueditor图片对话框</title>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
|
||||
<!-- jquery -->
|
||||
<script type="text/javascript" src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
|
||||
<!-- webuploader -->
|
||||
<script src="../../third-party/webuploader/webuploader.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../third-party/webuploader/webuploader.css">
|
||||
|
||||
<!-- attachment dialog -->
|
||||
<link rel="stylesheet" href="attachment.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="wrapper">
|
||||
<div id="tabhead" class="tabhead">
|
||||
<span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
|
||||
<span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
|
||||
</div>
|
||||
<div id="tabbody" class="tabbody">
|
||||
<!-- 上传图片 -->
|
||||
<div id="upload" class="panel focus">
|
||||
<div id="queueList" class="queueList">
|
||||
<div class="statusBar element-invisible">
|
||||
<div class="progress">
|
||||
<span class="text">0%</span>
|
||||
<span class="percentage"></span>
|
||||
</div><div class="info"></div>
|
||||
<div class="btns">
|
||||
<div id="filePickerBtn"></div>
|
||||
<div class="uploadBtn"><var id="lang_start_upload"></var></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="dndArea" class="placeholder">
|
||||
<div class="filePickerContainer">
|
||||
<div id="filePickerReady"></div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="filelist element-invisible">
|
||||
<li id="filePickerBlock" class="filePickerBlock"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 在线图片 -->
|
||||
<div id="online" class="panel">
|
||||
<div id="fileList"><var id="lang_imgLoading"></var></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="attachment.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
After Width: | Height: | Size: 923 B |
After Width: | Height: | Size: 841 B |
After Width: | Height: | Size: 1012 B |
After Width: | Height: | Size: 949 B |
After Width: | Height: | Size: 950 B |
After Width: | Height: | Size: 986 B |
After Width: | Height: | Size: 1001 B |
After Width: | Height: | Size: 996 B |
After Width: | Height: | Size: 1001 B |
After Width: | Height: | Size: 1009 B |
After Width: | Height: | Size: 1007 B |
After Width: | Height: | Size: 970 B |
After Width: | Height: | Size: 1005 B |
After Width: | Height: | Size: 1.0 KiB |
After Width: | Height: | Size: 3.6 KiB |
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 20 KiB |
After Width: | Height: | Size: 43 KiB |
After Width: | Height: | Size: 453 B |
After Width: | Height: | Size: 2.6 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 445 B |
After Width: | Height: | Size: 1.6 KiB |
@ -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;
|
||||
}
|
@ -0,0 +1,56 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="background.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="bg_container" class="wrapper">
|
||||
<div id="tabHeads" class="tabhead">
|
||||
<span class="focus" data-content-id="normal"><var id="lang_background_normal"></var></span>
|
||||
<span class="" data-content-id="imgManager"><var id="lang_background_local"></var></span>
|
||||
</div>
|
||||
<div id="tabBodys" class="tabbody">
|
||||
<div id="normal" class="panel focus">
|
||||
<fieldset class="bgarea">
|
||||
<legend><var id="lang_background_set"></var></legend>
|
||||
<div class="content">
|
||||
<div>
|
||||
<label><input id="nocolorRadio" class="iptradio" type="radio" name="t" value="none" checked="checked"><var id="lang_background_none"></var></label>
|
||||
<label><input id="coloredRadio" class="iptradio" type="radio" name="t" value="color"><var id="lang_background_colored"></var></label>
|
||||
</div>
|
||||
<div class="wrapcolor pl">
|
||||
<div class="color">
|
||||
<var id="lang_background_color"></var>:
|
||||
</div>
|
||||
<div id="colorPicker"></div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="wrapcolor pl">
|
||||
<label><var id="lang_background_netimg"></var>:</label><input class="txt" type="text" id="url">
|
||||
</div>
|
||||
<div id="alignment" class="alignment">
|
||||
<var id="lang_background_align"></var>:<select id="repeatType">
|
||||
<option value="center"></option>
|
||||
<option value="repeat-x"></option>
|
||||
<option value="repeat-y"></option>
|
||||
<option value="repeat"></option>
|
||||
<option value="self"></option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="custom" >
|
||||
<var id="lang_background_position"></var>:x:<input type="text" size="1" id="x" maxlength="4" value="0">px y:<input type="text" size="1" id="y" maxlength="4" value="0">px
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
</div>
|
||||
<div id="imgManager" class="panel">
|
||||
<div id="imageList" style=""></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript" src="background.js"></script>
|
||||
</body>
|
||||
</html>
|
@ -0,0 +1,376 @@
|
||||
(function () {
|
||||
|
||||
var onlineImage,
|
||||
backupStyle = editor.queryCommandValue('background');
|
||||
|
||||
window.onload = function () {
|
||||
initTabs();
|
||||
initColorSelector();
|
||||
};
|
||||
|
||||
/* 初始化tab标签 */
|
||||
function initTabs(){
|
||||
var tabs = $G('tabHeads').children;
|
||||
for (var i = 0; i < tabs.length; i++) {
|
||||
domUtils.on(tabs[i], "click", function (e) {
|
||||
var target = e.target || e.srcElement;
|
||||
for (var j = 0; j < tabs.length; j++) {
|
||||
if(tabs[j] == target){
|
||||
tabs[j].className = "focus";
|
||||
var contentId = tabs[j].getAttribute('data-content-id');
|
||||
$G(contentId).style.display = "block";
|
||||
if(contentId == 'imgManager') {
|
||||
initImagePanel();
|
||||
}
|
||||
}else {
|
||||
tabs[j].className = "";
|
||||
$G(tabs[j].getAttribute('data-content-id')).style.display = "none";
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/* 初始化颜色设置 */
|
||||
function initColorSelector () {
|
||||
var obj = editor.queryCommandValue('background');
|
||||
if (obj) {
|
||||
var color = obj['background-color'],
|
||||
repeat = obj['background-repeat'] || 'repeat',
|
||||
image = obj['background-image'] || '',
|
||||
position = obj['background-position'] || 'center center',
|
||||
pos = position.split(' '),
|
||||
x = parseInt(pos[0]) || 0,
|
||||
y = parseInt(pos[1]) || 0;
|
||||
|
||||
if(repeat == 'no-repeat' && (x || y)) repeat = 'self';
|
||||
|
||||
image = image.match(/url[\s]*\(([^\)]*)\)/);
|
||||
image = image ? image[1]:'';
|
||||
updateFormState('colored', color, image, repeat, x, y);
|
||||
} else {
|
||||
updateFormState();
|
||||
}
|
||||
|
||||
var updateHandler = function () {
|
||||
updateFormState();
|
||||
updateBackground();
|
||||
}
|
||||
domUtils.on($G('nocolorRadio'), 'click', updateBackground);
|
||||
domUtils.on($G('coloredRadio'), 'click', updateHandler);
|
||||
domUtils.on($G('url'), 'keyup', function(){
|
||||
if($G('url').value && $G('alignment').style.display == "none") {
|
||||
utils.each($G('repeatType').children, function(item){
|
||||
item.selected = ('repeat' == item.getAttribute('value') ? 'selected':false);
|
||||
});
|
||||
}
|
||||
updateHandler();
|
||||
});
|
||||
domUtils.on($G('repeatType'), 'change', updateHandler);
|
||||
domUtils.on($G('x'), 'keyup', updateBackground);
|
||||
domUtils.on($G('y'), 'keyup', updateBackground);
|
||||
|
||||
initColorPicker();
|
||||
}
|
||||
|
||||
/* 初始化颜色选择器 */
|
||||
function initColorPicker() {
|
||||
var me = editor,
|
||||
cp = $G("colorPicker");
|
||||
|
||||
/* 生成颜色选择器ui对象 */
|
||||
var popup = new UE.ui.Popup({
|
||||
content: new UE.ui.ColorPicker({
|
||||
noColorText: me.getLang("clearColor"),
|
||||
editor: me,
|
||||
onpickcolor: function (t, color) {
|
||||
updateFormState('colored', color);
|
||||
updateBackground();
|
||||
UE.ui.Popup.postHide();
|
||||
},
|
||||
onpicknocolor: function (t, color) {
|
||||
updateFormState('colored', 'transparent');
|
||||
updateBackground();
|
||||
UE.ui.Popup.postHide();
|
||||
}
|
||||
}),
|
||||
editor: me,
|
||||
onhide: function () {
|
||||
}
|
||||
});
|
||||
|
||||
/* 设置颜色选择器 */
|
||||
domUtils.on(cp, "click", function () {
|
||||
popup.showAnchor(this);
|
||||
});
|
||||
domUtils.on(document, 'mousedown', function (evt) {
|
||||
var el = evt.target || evt.srcElement;
|
||||
UE.ui.Popup.postHide(el);
|
||||
});
|
||||
domUtils.on(window, 'scroll', function () {
|
||||
UE.ui.Popup.postHide();
|
||||
});
|
||||
}
|
||||
|
||||
/* 初始化在线图片列表 */
|
||||
function initImagePanel() {
|
||||
onlineImage = onlineImage || new OnlineImage('imageList');
|
||||
}
|
||||
|
||||
/* 更新背景色设置面板 */
|
||||
function updateFormState (radio, color, url, align, x, y) {
|
||||
var nocolorRadio = $G('nocolorRadio'),
|
||||
coloredRadio = $G('coloredRadio');
|
||||
|
||||
if(radio) {
|
||||
nocolorRadio.checked = (radio == 'colored' ? false:'checked');
|
||||
coloredRadio.checked = (radio == 'colored' ? 'checked':false);
|
||||
}
|
||||
if(color) {
|
||||
domUtils.setStyle($G("colorPicker"), "background-color", color);
|
||||
}
|
||||
|
||||
if(url && /^\//.test(url)) {
|
||||
var a = document.createElement('a');
|
||||
a.href = url;
|
||||
browser.ie && (a.href = a.href);
|
||||
url = browser.ie ? a.href:(a.protocol + '//' + a.host + a.pathname + a.search + a.hash);
|
||||
}
|
||||
|
||||
if(url || url === '') {
|
||||
$G('url').value = url;
|
||||
}
|
||||
if(align) {
|
||||
utils.each($G('repeatType').children, function(item){
|
||||
item.selected = (align == item.getAttribute('value') ? 'selected':false);
|
||||
});
|
||||
}
|
||||
if(x || y) {
|
||||
$G('x').value = parseInt(x) || 0;
|
||||
$G('y').value = parseInt(y) || 0;
|
||||
}
|
||||
|
||||
$G('alignment').style.display = coloredRadio.checked && $G('url').value ? '':'none';
|
||||
$G('custom').style.display = coloredRadio.checked && $G('url').value && $G('repeatType').value == 'self' ? '':'none';
|
||||
}
|
||||
|
||||
/* 更新背景颜色 */
|
||||
function updateBackground () {
|
||||
if ($G('coloredRadio').checked) {
|
||||
var color = domUtils.getStyle($G("colorPicker"), "background-color"),
|
||||
bgimg = $G("url").value,
|
||||
align = $G("repeatType").value,
|
||||
backgroundObj = {
|
||||
"background-repeat": "no-repeat",
|
||||
"background-position": "center center"
|
||||
};
|
||||
|
||||
if (color) backgroundObj["background-color"] = color;
|
||||
if (bgimg) backgroundObj["background-image"] = 'url(' + bgimg + ')';
|
||||
if (align == 'self') {
|
||||
backgroundObj["background-position"] = $G("x").value + "px " + $G("y").value + "px";
|
||||
} else if (align == 'repeat-x' || align == 'repeat-y' || align == 'repeat') {
|
||||
backgroundObj["background-repeat"] = align;
|
||||
}
|
||||
|
||||
editor.execCommand('background', backgroundObj);
|
||||
} else {
|
||||
editor.execCommand('background', null);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* 在线图片 */
|
||||
function OnlineImage(target) {
|
||||
this.container = utils.isString(target) ? document.getElementById(target) : target;
|
||||
this.init();
|
||||
}
|
||||
OnlineImage.prototype = {
|
||||
init: function () {
|
||||
this.reset();
|
||||
this.initEvents();
|
||||
},
|
||||
/* 初始化容器 */
|
||||
initContainer: function () {
|
||||
this.container.innerHTML = '';
|
||||
this.list = document.createElement('ul');
|
||||
this.clearFloat = document.createElement('li');
|
||||
|
||||
domUtils.addClass(this.list, 'list');
|
||||
domUtils.addClass(this.clearFloat, 'clearFloat');
|
||||
|
||||
this.list.id = 'imageListUl';
|
||||
this.list.appendChild(this.clearFloat);
|
||||
this.container.appendChild(this.list);
|
||||
},
|
||||
/* 初始化滚动事件,滚动到地步自动拉取数据 */
|
||||
initEvents: function () {
|
||||
var _this = this;
|
||||
|
||||
/* 滚动拉取图片 */
|
||||
domUtils.on($G('imageList'), 'scroll', function(e){
|
||||
var panel = this;
|
||||
if (panel.scrollHeight - (panel.offsetHeight + panel.scrollTop) < 10) {
|
||||
_this.getImageData();
|
||||
}
|
||||
});
|
||||
/* 选中图片 */
|
||||
domUtils.on(this.container, 'click', function (e) {
|
||||
var target = e.target || e.srcElement,
|
||||
li = target.parentNode,
|
||||
nodes = $G('imageListUl').childNodes;
|
||||
|
||||
if (li.tagName.toLowerCase() == 'li') {
|
||||
updateFormState('nocolor', null, '');
|
||||
for (var i = 0, node; node = nodes[i++];) {
|
||||
if (node == li && !domUtils.hasClass(node, 'selected')) {
|
||||
domUtils.addClass(node, 'selected');
|
||||
updateFormState('colored', null, li.firstChild.getAttribute("_src"), 'repeat');
|
||||
} else {
|
||||
domUtils.removeClasses(node, 'selected');
|
||||
}
|
||||
}
|
||||
updateBackground();
|
||||
}
|
||||
});
|
||||
},
|
||||
/* 初始化第一次的数据 */
|
||||
initData: function () {
|
||||
|
||||
/* 拉取数据需要使用的值 */
|
||||
this.state = 0;
|
||||
this.listSize = editor.getOpt('imageManagerListSize');
|
||||
this.listIndex = 0;
|
||||
this.listEnd = false;
|
||||
|
||||
/* 第一次拉取数据 */
|
||||
this.getImageData();
|
||||
},
|
||||
/* 重置界面 */
|
||||
reset: function() {
|
||||
this.initContainer();
|
||||
this.initData();
|
||||
},
|
||||
/* 向后台拉取图片列表数据 */
|
||||
getImageData: function () {
|
||||
var _this = this;
|
||||
|
||||
if(!_this.listEnd && !this.isLoadingData) {
|
||||
this.isLoadingData = true;
|
||||
var url = editor.getActionUrl(editor.getOpt('imageManagerActionName')),
|
||||
isJsonp = utils.isCrossDomainUrl(url);
|
||||
ajax.request(url, {
|
||||
'timeout': 100000,
|
||||
'dataType': isJsonp ? 'jsonp':'',
|
||||
'data': utils.extend({
|
||||
start: this.listIndex,
|
||||
size: this.listSize
|
||||
}, editor.queryCommandValue('serverparam')),
|
||||
'method': 'get',
|
||||
'onsuccess': function (r) {
|
||||
try {
|
||||
var json = isJsonp ? r:eval('(' + r.responseText + ')');
|
||||
if (json.state == 'SUCCESS') {
|
||||
_this.pushData(json.list);
|
||||
_this.listIndex = parseInt(json.start) + parseInt(json.list.length);
|
||||
if(_this.listIndex >= json.total) {
|
||||
_this.listEnd = true;
|
||||
}
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
} catch (e) {
|
||||
if(r.responseText.indexOf('ue_separate_ue') != -1) {
|
||||
var list = r.responseText.split(r.responseText);
|
||||
_this.pushData(list);
|
||||
_this.listIndex = parseInt(list.length);
|
||||
_this.listEnd = true;
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
'onerror': function () {
|
||||
_this.isLoadingData = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
/* 添加图片到列表界面上 */
|
||||
pushData: function (list) {
|
||||
var i, item, img, icon, _this = this,
|
||||
urlPrefix = editor.getOpt('imageManagerUrlPrefix');
|
||||
for (i = 0; i < list.length; i++) {
|
||||
if(list[i] && list[i].url) {
|
||||
item = document.createElement('li');
|
||||
img = document.createElement('img');
|
||||
icon = document.createElement('span');
|
||||
|
||||
domUtils.on(img, 'load', (function(image){
|
||||
return function(){
|
||||
_this.scale(image, image.parentNode.offsetWidth, image.parentNode.offsetHeight);
|
||||
}
|
||||
})(img));
|
||||
img.width = 113;
|
||||
img.setAttribute('src', urlPrefix + list[i].url + (list[i].url.indexOf('?') == -1 ? '?noCache=':'&noCache=') + (+new Date()).toString(36) );
|
||||
img.setAttribute('_src', urlPrefix + list[i].url);
|
||||
domUtils.addClass(icon, 'icon');
|
||||
|
||||
item.appendChild(img);
|
||||
item.appendChild(icon);
|
||||
this.list.insertBefore(item, this.clearFloat);
|
||||
}
|
||||
}
|
||||
},
|
||||
/* 改变图片大小 */
|
||||
scale: function (img, w, h, type) {
|
||||
var ow = img.width,
|
||||
oh = img.height;
|
||||
|
||||
if (type == 'justify') {
|
||||
if (ow >= oh) {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
} else {
|
||||
if (ow >= oh) {
|
||||
img.width = w * ow / oh;
|
||||
img.height = h;
|
||||
img.style.marginLeft = '-' + parseInt((img.width - w) / 2) + 'px';
|
||||
} else {
|
||||
img.width = w;
|
||||
img.height = h * oh / ow;
|
||||
img.style.marginTop = '-' + parseInt((img.height - h) / 2) + 'px';
|
||||
}
|
||||
}
|
||||
},
|
||||
getInsertList: function () {
|
||||
var i, lis = this.list.children, list = [], align = getAlign();
|
||||
for (i = 0; i < lis.length; i++) {
|
||||
if (domUtils.hasClass(lis[i], 'selected')) {
|
||||
var img = lis[i].firstChild,
|
||||
src = img.getAttribute('_src');
|
||||
list.push({
|
||||
src: src,
|
||||
_src: src,
|
||||
floatStyle: align
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
return list;
|
||||
}
|
||||
};
|
||||
|
||||
dialog.onok = function () {
|
||||
updateBackground();
|
||||
editor.fireEvent('saveScene');
|
||||
};
|
||||
dialog.oncancel = function () {
|
||||
editor.execCommand('background', backupStyle);
|
||||
};
|
||||
|
||||
})();
|
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 1.6 KiB |
@ -0,0 +1,65 @@
|
||||
/*
|
||||
* 图表配置文件
|
||||
* */
|
||||
|
||||
|
||||
//不同类型的配置
|
||||
var typeConfig = [
|
||||
{
|
||||
chart: {
|
||||
type: 'line'
|
||||
},
|
||||
plotOptions: {
|
||||
line: {
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
},
|
||||
enableMouseTracking: true
|
||||
}
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
type: 'line'
|
||||
},
|
||||
plotOptions: {
|
||||
line: {
|
||||
dataLabels: {
|
||||
enabled: true
|
||||
},
|
||||
enableMouseTracking: false
|
||||
}
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
type: 'area'
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
type: 'bar'
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
type: 'column'
|
||||
}
|
||||
}, {
|
||||
chart: {
|
||||
plotBackgroundColor: null,
|
||||
plotBorderWidth: null,
|
||||
plotShadow: false
|
||||
},
|
||||
plotOptions: {
|
||||
pie: {
|
||||
allowPointSelect: true,
|
||||
cursor: 'pointer',
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
color: '#000000',
|
||||
connectorColor: '#000000',
|
||||
formatter: function() {
|
||||
return '<b>'+ this.point.name +'</b>: '+ ( Math.round( this.point.percentage*100 ) / 100 ) +' %';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
];
|
@ -0,0 +1,165 @@
|
||||
html, body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.main {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.table-view {
|
||||
height: 100%;
|
||||
float: left;
|
||||
margin: 20px;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.table-view .table-container {
|
||||
width: 100%;
|
||||
margin-bottom: 50px;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
.table-view th {
|
||||
padding: 5px 10px;
|
||||
background-color: #F7F7F7;
|
||||
}
|
||||
|
||||
.table-view td {
|
||||
width: 50px;
|
||||
text-align: center;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
.table-container input {
|
||||
width: 40px;
|
||||
padding: 5px;
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.table-view caption {
|
||||
font-size: 18px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.charts-view {
|
||||
/*margin-left: 49%!important;*/
|
||||
width: 50%;
|
||||
margin-left: 49%;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.charts-container {
|
||||
border-left: 1px solid #c3c3c3;
|
||||
}
|
||||
|
||||
.charts-format fieldset {
|
||||
padding-left: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.charts-format legend {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.format-item-container {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.format-item-container label {
|
||||
display: block;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.charts-format .data-item {
|
||||
border: 1px solid black;
|
||||
outline: none;
|
||||
padding: 2px 3px;
|
||||
}
|
||||
|
||||
/* 图表类型 */
|
||||
|
||||
.charts-type {
|
||||
margin-top: 50px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.scroll-view {
|
||||
border: 1px solid #c3c3c3;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
margin: 20px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.scroll-bed {
|
||||
width: 10000px;
|
||||
_margin-top: 20px;
|
||||
-webkit-transition: margin-left .5s ease;
|
||||
-moz-transition: margin-left .5s ease;
|
||||
transition: margin-left .5s ease;
|
||||
}
|
||||
|
||||
.view-box {
|
||||
display: inline-block;
|
||||
*display: inline;
|
||||
*zoom: 1;
|
||||
margin-right: 20px;
|
||||
border: 2px solid white;
|
||||
line-height: 0;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.view-box img {
|
||||
border: 1px solid #cecece;
|
||||
}
|
||||
|
||||
.view-box.selected {
|
||||
border-color: #7274A7;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.button-container a {
|
||||
display: inline-block;
|
||||
width: 100px;
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
border: 1px solid #c2ccd1;
|
||||
margin-right: 30px;
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
-webkit-border-radius: 2px;
|
||||
-moz-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.button-container a:HOVER {
|
||||
background: #fcfcfc;
|
||||
}
|
||||
|
||||
.button-container a:ACTIVE {
|
||||
border-top-color: #c2ccd1;
|
||||
box-shadow:inset 0 5px 4px -4px rgba(49, 49, 64, 0.1);
|
||||
}
|
||||
|
||||
.edui-charts-not-data {
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
text-align: center;
|
||||
}
|
@ -0,0 +1,89 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>chart</title>
|
||||
<meta chartset="utf-8">
|
||||
<link rel="stylesheet" type="text/css" href="charts.css">
|
||||
<script type="text/javascript" src="../internal.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="main">
|
||||
<div class="table-view">
|
||||
<h3><var id="lang_data_source"></var></h3>
|
||||
<div id="tableContainer" class="table-container"></div>
|
||||
<h3><var id="lang_chart_format"></var></h3>
|
||||
<form name="data-form">
|
||||
<div class="charts-format">
|
||||
<fieldset>
|
||||
<legend><var id="lang_data_align"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="1" checked="checked">
|
||||
<var id="lang_chart_align_same"></var>
|
||||
</label>
|
||||
<label>
|
||||
<input type="radio" class="format-ctrl not-pie-item" name="charts-format" value="-1">
|
||||
<var id="lang_chart_align_reverse"></var>
|
||||
</label>
|
||||
<br>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_title"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<var id="lang_chart_main_title"></var><input type="text" name="title" class="data-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_sub_title"></var><input type="text" name="sub-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_x_title"></var><input type="text" name="x-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
<label>
|
||||
<var id="lang_chart_y_title"></var><input type="text" name="y-title" class="data-item not-pie-item">
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_tip"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label>
|
||||
<var id="lang_cahrt_tip_prefix"></var>
|
||||
<input type="text" id="tipInput" name="tip" class="data-item" disabled="disabled">
|
||||
</label>
|
||||
<p><var id="lang_cahrt_tip_description"></var></p>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><var id="lang_chart_data_unit"></var></legend>
|
||||
<div class="format-item-container">
|
||||
<label><var id="lang_chart_data_unit_title"></var><input type="text" name="unit" class="data-item"></label>
|
||||
<p><var id="lang_chart_data_unit_description"></var></p>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="charts-view">
|
||||
<div id="chartsContainer" class="charts-container"></div>
|
||||
<div id="chartsType" class="charts-type">
|
||||
<h3><var id="lang_chart_type"></var></h3>
|
||||
<div class="scroll-view">
|
||||
<div class="scroll-container">
|
||||
<div id="scrollBed" class="scroll-bed"></div>
|
||||
</div>
|
||||
<div id="buttonContainer" class="button-container">
|
||||
<a href="#" data-title="prev"><var id="lang_prev_btn"></var></a>
|
||||
<a href="#" data-title="next"><var id="lang_next_btn"></var></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="../../third-party/jquery-1.10.2.min.js"></script>
|
||||
<script src="../../third-party/highcharts/highcharts.js"></script>
|
||||
<script src="chart.config.js"></script>
|
||||
<script src="charts.js"></script>
|
||||
</body>
|
||||
</html>
|
After Width: | Height: | Size: 25 KiB |
After Width: | Height: | Size: 19 KiB |
After Width: | Height: | Size: 22 KiB |
After Width: | Height: | Size: 7.6 KiB |
After Width: | Height: | Size: 8.1 KiB |
After Width: | Height: | Size: 46 KiB |