new w-ui-dwload(vo, optopt) → {Object}
- Description:
前端UI下載套件
- Source:
Example
let WUiDwload = window['w-ui-dwload']
// console.log(WUiDwload)
//wuidw
let vo = {
updateLoading: (v)=>{
console.log('updateLoading', v)
},
alert: (v, t)=>{
console.log('alert', v, t)
},
downloadFileById: ()=>{
},
}
let wuidw = WUiDwload(vo, {
keyFunDownloadFileById: 'downloadFileById',
keyFunUpdateLoading: 'updateLoading',
keyFunAlert: 'alert',
})
console.log(wuidw)
Parameters:
Name | Type | Attributes | Default | Description | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
vo |
Object | 輸入前端共用操作物件,也就是掛載共用函數之處,例如Vue.prototype |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
opt |
Object |
<optional> |
{}
|
輸入設定物件,預設{} Properties
|
Returns:
回傳各下載函數物件,包括'downloadPic','downloadTable','downloadLtdt','downloadFile'
- Type
- Object
Methods
(async, static) downloadFile(file, setProg, optopt) → {Promise}
- Description:
前端呼叫函數(前後端)下載檔案
- Source:
Example
let WUiDwload = window['w-ui-dwload']
// console.log(WUiDwload)
let file = {
'id': 'id-for-file',
}
//wuidw
let vo = {
updateLoading: (v)=>{
console.log('updateLoading', v)
},
alert: (v, t)=>{
console.log('alert', v, t)
},
downloadFileById: (fileId)=>{
//記得添加BOM
let u8a = wsemi.str2u8arr(`\ufeff中文測試
Plain text, unformatted text
Text file, a type of computer file opened by most text software
Text string, a sequence of characters manipulated by software
Text message, a short electronic message designed for communication between mobile phone users
Text (Chrome app), a text editor for the Google Chrome web browser`)
return {
fileName:'name-for-file',
u8a,
type:'text/plain',
}
},
}
let wuidw = WUiDwload(vo, {
keyFunDownloadFileById: 'downloadFileById',
keyFunUpdateLoading: 'updateLoading',
keyFunAlert: 'alert',
})
console.log(wuidw)
function dw(){
wuidw.downloadFile(file)
}
Parameters:
Name | Type | Attributes | Default | Description | ||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
file |
Object | 輸入檔案資料物件,至少需有id欄位 |
||||||||||||||||||||||
setProg |
function |
null
|
輸入下載階段調用提供進度函數,需建構並由按鈕或進度視窗提供 |
|||||||||||||||||||||
opt |
Object |
<optional> |
{}
|
輸入設定物件,預設{} Properties
|
Returns:
回傳Promise,resolve代表執行結束,不會有reject,將由console.log或alert(若有)顯示發生之錯誤訊息
- Type
- Promise
(async, static) downloadLtdt(ltdt, eleName, optopt) → {Promise}
- Description:
前端將ltdt數據下載成為Excel檔(*.xlsx)
- Source:
Example
let WUiDwload = window['w-ui-dwload']
// console.log(WUiDwload)
let ltdt = [
{
"firstName": "John",
"lastName": "Smith",
"sex": "male",
"age(年齡)": 25,
},
{
"firstName": "Worthly",
"lastName": "Bill",
"sex": "female",
"age(年齡)": 22,
},
{
"firstName": "Sandola",
"lastName": "Dell",
"sex": "male",
"age(年齡)": 31,
},
]
//wuidw
let vo = {
updateLoading: (v)=>{
console.log('updateLoading', v)
},
alert: (v, t)=>{
console.log('alert', v, t)
},
downloadFileById: ()=>{
},
}
let wuidw = WUiDwload(vo, {
keyFunDownloadFileById: 'downloadFileById',
keyFunUpdateLoading: 'updateLoading',
keyFunAlert: 'alert',
})
console.log(wuidw)
function dw(){
let eleName = document.querySelector('#name')
wuidw.downloadLtdt(ltdt, eleName)
// let name = 'ltdt-name'
// wuidw.downloadLtdt(ltdt, name)
}
Parameters:
Name | Type | Attributes | Default | Description | ||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
ltdt |
Array | 輸入數據陣列 |
||||||||||||||||||||||||||||||||
eleName |
HTMLElement | String | 輸入表名所在元素或表名字串 |
||||||||||||||||||||||||||||||||
opt |
Object |
<optional> |
{}
|
輸入設定物件,預設{} Properties
|
Returns:
回傳Promise,resolve代表執行結束,不會有reject,將由console.log或alert(若有)顯示發生之錯誤訊息
- Type
- Promise
(async, static) downloadPic(elePic, eleName, optopt) → {Promise}
- Description:
前端將dom下載成為圖片
- Source:
Example
let WUiDwload = window['w-ui-dwload']
// console.log(WUiDwload)
//wuidw
let vo = {
updateLoading: (v)=>{
console.log('updateLoading', v)
},
alert: (v, t)=>{
console.log('alert', v, t)
},
downloadFileById: ()=>{
},
}
let wuidw = WUiDwload(vo, {
keyFunDownloadFileById: 'downloadFileById',
keyFunUpdateLoading: 'updateLoading',
keyFunAlert: 'alert',
})
console.log(wuidw)
function dw(){
let eleTar = document.querySelector('#container')
let eleName = document.querySelector('#name')
wuidw.downloadPic(eleTar, eleName)
}
Parameters:
Name | Type | Attributes | Default | Description | ||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
elePic |
HTMLElement | 輸入圖片所在元素 |
||||||||||||||||||||||||||||||||
eleName |
HTMLElement | String | 輸入圖名所在元素或圖名字串 |
||||||||||||||||||||||||||||||||
opt |
Object |
<optional> |
{}
|
輸入設定物件,預設{} Properties
|
Returns:
回傳Promise,resolve代表執行結束,不會有reject,將由console.log或alert(若有)顯示發生之錯誤訊息
- Type
- Promise
(async, static) downloadTable(eleTable, eleName, optopt) → {Promise}
- Description:
前端將dom(table)內數據下載成為Excel檔(*.xlsx)
- Source:
Example
let WUiDwload = window['w-ui-dwload']
// console.log(WUiDwload)
//wuidw
let vo = {
updateLoading: (v)=>{
console.log('updateLoading', v)
},
alert: (v, t)=>{
console.log('alert', v, t)
},
downloadFileById: ()=>{
},
}
let wuidw = WUiDwload(vo, {
keyFunDownloadFileById: 'downloadFileById',
keyFunUpdateLoading: 'updateLoading',
keyFunAlert: 'alert',
})
console.log(wuidw)
function dw(){
let eleTar = document.querySelector('#container')
let eleName = document.querySelector('#name')
wuidw.downloadTable(eleTar, eleName)
}
Parameters:
Name | Type | Attributes | Default | Description | ||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
eleTable |
HTMLElement | 輸入表格所在元素 |
||||||||||||||||||||||||||||||||
eleName |
HTMLElement | String | 輸入表名所在元素或表名字串 |
||||||||||||||||||||||||||||||||
opt |
Object |
<optional> |
{}
|
輸入設定物件,預設{} Properties
|
Returns:
回傳Promise,resolve代表執行結束,不會有reject,將由console.log或alert(若有)顯示發生之錯誤訊息
- Type
- Promise