Skip to content

Commit b4cd405

Browse files
wangfupeng1988wangfupeng1988
committed
v3 上传图片基础功能
1 parent af8c82f commit b4cd405

19 files changed

Lines changed: 1030 additions & 72 deletions

File tree

‎example/server/index.js‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1+
const fs = require('fs')
12
const path = require('path')
3+
const formidable = require('formidable')
4+
const util = require('./util.js')
25

36
const koa = require('koa')
47
const app = koa()
@@ -20,6 +23,51 @@ app.use(staticCache(releaseDir))
2023

2124
// 配置路由
2225
const router = require('koa-router')()
26+
// 上传图片
27+
router.post('/upload-img', function* () {
28+
// const ctx = this
29+
// const req = ctx.req
30+
// const res = ctx.res
31+
// // 存储图片链接
32+
// const imgLinks = []
33+
// const form = new formidable.IncomingForm()
34+
// form.parse(req, function (err, fields, files) {
35+
// if (err) {
36+
// throw new Error('formidable, form.parse err', err.stack)
37+
// }
38+
// // 存储图片的文件夹
39+
// const storePath = path.resolve(__dirname, '..', 'upload-files')
40+
// if (!fs.existsSync(storePath)) {
41+
// fs.mkdirSync(storePath)
42+
// }
43+
44+
// // 遍历所有上传来的图片
45+
// util.objForEach(files, (name, file) => {
46+
// // 图片临时位置
47+
// const tempFilePath = file.path
48+
// // 图片名称和路径
49+
// const fileName = file.name
50+
// const fullFileName = path.join(storePath, fileName)
51+
// // 将临时文件保存为正式文件
52+
// fs.renameSync(tempFilePath, fullFileName)
53+
// // 存储链接
54+
// imgLinks.push('/upload-files/' + fileName)
55+
// })
56+
// })
57+
// // 返回结果
58+
// this.body = JSON.stringify({
59+
// errno: 0,
60+
// data: imgLinks
61+
// })
62+
63+
this.body = JSON.stringify({
64+
errno: 0,
65+
data: [
66+
'http://www.cnblogs.com/images/logo_small.gif'
67+
]
68+
})
69+
})
70+
app.use(router.routes()).use(router.allowedMethods());
2371

2472
// 启动服务
2573
app.listen(3000)

‎example/server/util.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
module.exports = {
2+
// 遍历对象
3+
objForEach: function (obj, fn) {
4+
let key, result
5+
for (key in obj) {
6+
if (obj.hasOwnProperty(key)) {
7+
result = fn.call(obj, key, obj[key])
8+
if (result === false) {
9+
break
10+
}
11+
}
12+
}
13+
}
14+
}

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
"babel-plugin-external-helpers": "^6.22.0",
3636
"babel-preset-latest": "^6.24.0",
3737
"cssgrace": "^3.0.0",
38+
"formidable": "^1.1.1",
3839
"gulp": "^3.9.1",
3940
"gulp-concat": "^2.6.1",
4041
"gulp-cssmin": "^0.1.7",

‎release/wangEditor.css‎

Lines changed: 26 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -196,6 +196,7 @@
196196
color: #333;
197197
background-color: #fff;
198198
/* 为 emotion panel 定制的样式 */
199+
/* 上传图片的 panel 定制样式 */
199200
}
200201
.w-e-text-container .w-e-panel-container .w-e-panel-tab-title {
201202
list-style: none;
@@ -264,7 +265,7 @@
264265
font-size: 14px;
265266
color: #1e88e5;
266267
border: none;
267-
padding: 10px;
268+
padding: 5px 10px;
268269
background-color: #fff;
269270
cursor: pointer;
270271
border-radius: 3px;
@@ -296,11 +297,35 @@
296297
font-size: 18px;
297298
padding: 0 3px;
298299
}
300+
.w-e-text-container .w-e-panel-container .w-e-up-img-container {
301+
text-align: center;
302+
}
303+
.w-e-text-container .w-e-panel-container .w-e-up-img-container .w-e-up-btn {
304+
display: inline-block;
305+
*display: inline;
306+
*zoom: 1;
307+
color: #999;
308+
cursor: pointer;
309+
font-size: 60px;
310+
line-height: 1;
311+
}
312+
.w-e-text-container .w-e-panel-container .w-e-up-img-container .w-e-up-btn:hover {
313+
color: #333;
314+
}
299315

300316
.w-e-text-container {
301317
position: relative;
302318
z-index: 10000;
303319
}
320+
.w-e-text-container .w-e-bar {
321+
position: absolute;
322+
background-color: #f1f1f1;
323+
padding: 2px 5px;
324+
color: #666;
325+
bottom: 0;
326+
left: 0;
327+
font-size: 12px;
328+
}
304329
.w-e-text {
305330
padding: 0 10px;
306331
overflow-y: scroll;

0 commit comments

Comments
 (0)