QF 参考

QF 是 QuickAdmin.Net 框架在浏览器端提供的一个 JS 对象，封装了一些属性、工具方法和 UI 操作。
以下所列属性/方法为全局成员，即所有页面都具有的成员。标注了只读的属性，表示你不要去更改它。
其中有一些方法是对 FineUICore 控件的操作，需要知道控件的 ID，为方便调用，QF 内对控件的 ID 做了以下默认约定：表格的默认 ID 为 "gridCtrl"，表单的默认 ID 为 "formCtrl"，树控件的默认 ID 为 "treeCtrl"，窗体的默认 ID 为 "winCtrl"。即若在调用方法时没有提供控件 ID，将按照这个约定使用。在页面里命名控件时也按照这个约定去做，这样方便调用。

如果想在后端给 QF 添加全局自定义成员(即所有页面都具有的自定义成员)，书写一个实现了 IGlobalQFObjectService 服务，在其中定义成员，然后将其注入系统即可。参见 IGlobalQFObjectService.QFObjectopen in new window 文档。

如果想在后端给指定页面修改 QF 或添加自定义属性，可通过在该页面代码里重写 QFObjectopen in new window 属性或通过调用 RegisterQFObjectCustomDataopen in new window 方法(通常在 OnGet() 里调用)来进行。

Properties

appVer

QF.appVer : string
只读。当前应用版本。

curLang

QF.curLang : string
只读。当前语言。若未启用多语言，值为 null。

curTheme

QF.curTheme : string
只读。当前主题。

handlerFormat

QF.handlerFormat : string
当前页处理程序 URL 的格式(绝对地址，包含基路径，包含queryString)。Razor 页面和 MVC 视图页对应的默认值分别为：

// 假设当前页面为：/Samples/SimplePage1?p1=123&p2=abc
// 对于 Razor 页面：
QF.handlerFormat == '/Samples/SimplePage1?handler={0}&p1=123&p2=abc'
// 对于 MVC 视图页：
QF.handlerFormat == '/Samples/{0}?p1=123&p2=abc'

此属性可用来构造调用当前页面后端方法的 Url。

isBuiltIn

QF.isBuiltIn : boolean
只读。指示当前页面是否是内置页面。

loginPage

QF.loginPage : string
只读。当前应用登录页面的相对地址，不含基路径。

notifyDefaultPositionX

QF.notifyDefaultPositionX : number
消息通知框的默认横向位置：0 - 左(left)，1 - 中(center)，2 - 右(right)。默认值 1。

notifyDefaultPositionY

QF.notifyDefaultPositionY : number
消息通知框的默认纵向位置：0 - 上(top)，1 - 中(center)，2 - 下(bottom)。默认值 0。

openBuiltInPageInFloatingPanel

QF.openBuiltInPageInFloatingPanel : boolean
只读。取自配置项 OpenBuiltInPageInFloatingPanelopen in new window。

path

QF.path : string
只读。当前页面绝对路径，包含基路径，不包含路由参数、queryString。

pathBase

QF.pathBase : string
只读。当前应用的基路径。
这个与 F.baseUrl 的区别见下：

// 当应用部署在根目录时：
QF.pathBase == ''
F.baseUrl == '/'
// 当应用部署在子目录时(比如在 QSample 子目录下)：
QF.pathBase == '/QSample'
F.baseUrl == '/QSample/'

queryString

QF.queryString : string
只读。当前页面的查询字符串(不含问号?)。参数值将被编码，如：

// 若查询字符串为：?q1=123&q2=abc&q3=参数
QF.queryString == 'q1=123&q2=abc&q3=%E5%8F%82%E6%95%B0'

routeValues

QF.routeValues : object
只读。当前 MVC 视图页的路由参数。对于 Razor 页面，返回 null。
返回的对象有哪些属性由你的路由设置决定。例如，你的路由设置为：

app.MapControllerRoute(
    name: "default",
    pattern: "{controller=Home}/{action=Index}/{id?}"
);

那页面 /Samples/SimplePage1/123 里的 routeValues 将为：

showLoadingCtrl

QF.showLoadingCtrl : object
指示在进行提交操作时，在当前页面哪个 FineUICore 控件上遮罩显示 loading 动画。
默认为 null。设置时通常设置为页面最外层的 FineUICore 控件，设置后调用 QF.ajaxPostForm()、QF.ajaxPostJson() 等等时将自动在其上显示 loading 动画，执行完成后则自动隐藏动画。

version

QF.version : string
只读。框架版本。

Methods

notify 方法

用来显示通知消息的方法，共有三个方法，原型一致：
在当前窗口显示通知：QF.notifySelf(msg, [iconFlag], [displayMS], [positionY], [positionX])
在父窗口显示通知：QF.notifyParent(msg, [iconFlag], [displayMS], [positionY], [positionX])
在顶层窗口显示通知：QF.notifyTop(msg, [iconFlag], [displayMS], [positionY], [positionX])

Param	Type	Default	Description
msg	`string`		要显示的消息
[iconFlag]	`number`	`1`	图标标志 (-1:错误图标, 0:无图标, 1:信息图标)
[displayMS]	`number`	`3000`	指定显示多长时间后自动消失(毫秒), 0 表示一直显示
[positionY]	`number`		Y轴位置 (0:顶部, 1:中部, 2:底部), 若未提供, 将用 `QF.notifyDefaultPositionY`
[positionX]	`number`		X轴位置 (0:左侧, 1:中部, 2:右侧), 若未提供, 将用 `QF.notifyDefaultPositionX`

这几个方法是对 F.notify() 的二次封装，以便简化调用。
其中对消息字符串里的换行符进行了识别，可方便地显示多行消息，见示例：

QF.notifySelf('操作成功');
QF.notifySelf('操作失败', -1);

// F.notify() 换行得传入 "<raw>这是第一行<br/>这是第二行</raw>"
QF.notifySelf('这是第一行\n这是第二行');

// 也可传入 html，用 <raw></raw> 包裹
QF.notifySelf('<raw><span style="font-weight: bold; color: red;">红色文字</span></raw>');

alert 方法

用来弹出消息框的方法，共有三个方法，原型一致：
在当前窗口出消息框：QF.alertSelf(msg, [iconFlag], [onOK], [title])
在父窗口出消息框：QF.alertParent(msg, [iconFlag], [onOK], [title])
在顶层窗口出消息框：QF.alertTop(msg, [iconFlag], [onOK], [title])

Param	Type	Default	Description
msg	`string`		要显示的消息
[iconFlag]	`number`	`1`	图标标志 (-1:错误图标, 0:无图标, 1:信息图标)
[onOK]	`function`		点击确定时的回调函数
[title]	`string`	'提示'	消息框标题

这几个方法是对 F.alert() 的二次封装，以便简化调用。
其中对消息字符串里的换行符进行了识别，可方便地显示多行消息，见示例：

QF.alertSelf('操作成功');
QF.alertSelf('操作失败', -1);

// F.alert() 换行得传入 "<raw>这是第一行<br/>这是第二行</raw>"
QF.alertSelf('这是第一行\n这是第二行');

// 也可传入 html，用 <raw></raw> 包裹
QF.alertSelf('<raw><span style="font-weight: bold; color: red;">红色文字</span></raw>');

QF.alertSelf(
  'Hello!', 
  1, 
  () => { 
    QF.notifySelf('你点击了确定');
  }
);

confirm 方法

用来显示确认对话框的方法，支持二次确认，共有三个方法，原型一致：
在当前窗口显示确认对话框：QF.confirmSelf(msg, [onOK], [onCancel], [title])
在父窗口显示确认对话框：QF.confirmParent(msg, [onOK], [onCancel], [title])
在顶层窗口显示确认对话框：QF.confirmTop(msg, [onOK], [onCancel], [title])

Param	Type	Default	Description
msg	`string` \| `Array.<string>`		确认消息
[onOK]	`function`		点击确定时的回调函数
[onCancel]	`function`		点击取消时的回调函数
[title]	`string`	'提示'	对话框标题

这几个方法是对 F.confirm() 的二次封装，以便简化调用。图标固定为 'question'。
与前边的 notify/alert 一样，其中也对消息字符串里的换行符进行了识别，可方便地显示多行消息。
另外，支持二次确认：msg 参数传入包含两个消息字符串的数组即可，见示例。

// 换行消息
QF.confirmSelf(
  '确定执行吗?\n(注意：操作不可逆)', 
  () => {
    console.log('执行逻辑');
  }
);

// 二次确认
QF.confirmSelf(
  [
    '确定删除所选记录吗？',
    '请再次确认要删除所选记录吗？'
  ], 
  () => {
    console.log('删除操作');
  }
);

// HTML 消息
QF.confirmSelf(
  '<raw>确定删除所选菜单项吗？<br/><span style="font-weight: bold; color: red;">注意：所有子菜单项以及授权数据将被一并删除！</span></raw>',
  () => {
    console.log('删除操作');
  }
);

post 方法

QF 提供了 ajaxPostForm() 和 ajaxPostJson() 方法，是对 $.ajax() 的封装，支持相对url、自动带上防伪令牌、支持先进行确认以及二次确认等等，让你能更方便地发起 POST 请求，具体见后边说明。
简化调用：
QF.ajaxPostForm(url, [data], [success])
QF.ajaxPostJson(url, [data], [success])

QF.ajaxPostForm('~/api/MyTest/Test1', { val1: 123, val2: 'abc' }, (res) => { console.log(res); });

传入选项调用：
QF.ajaxPostForm(options)
QF.ajaxPostJson(options)

QF.ajaxPostJson({
  url: '~/api/MyTest/Test2',
  data: {
    val1: 123,
    val2: 'abc'
  },
  success: (res) => {
    console.log(res); 
  },
  error: () => {
    console.warn('post error'); 
  },
  complete: () => {
    console.log('post complete');
  }
});

具体功能：

ajaxPostForm 发送 application/x-www-form-urlencoded 请求，ajaxPostJson 则发送 application/json 请求。
ajaxPostForm 还可发送 FormData 数据(比如上传文件)，选项里加上 isFormData: true 即可：

var formData = new FormData();
formData.append("file", $('#fileInput')[0].files[0]);
formData.append("val1", 123);
formData.append("val2", 'abc');
QF.ajaxPostForm({
  url: '~/MyTest/UploadFile',
  isFormData: true,
  data: formData,
  success: (res) => {
    console.log(res); 
  }
});

ajaxPostJson 里，会把传入的 data 对象用 JSON.stringify() 转为 json 字符串然后再提交。当然你也可以直接给 data 传入 json 字符串。
提交时会自动带上当前页面的防伪令牌。
url 建议传入以 ~/ 打头的相对地址，方法内会自动将其转为绝对地址，可确保不论在哪调用都可以。已禁止向外部地址提交。
url 可为当前页面后端处理程序名称，例如以下为某页面后端代码，有 MyHandler1、MyHandler2 两个 post 处理方法：

// 异步版本方法
public async Task<IActionResult> OnPostMyHandler1Async()
{
    ...
    if (failed)
        return ServiceResult.Failed("error msg").ToCamelCaseJsonContentResult();
    return ServiceResult.Ok().ToCamelCaseJsonContentResult();
}

// 同步版本方法
public IActionResult OnPostMyHandler2()
{
    ...
    if (failed)
        return ServiceResult.Failed("error msg").ToCamelCaseJsonContentResult();
    return ServiceResult.Ok().ToCamelCaseJsonContentResult();
}

提交到 MyHandler1 或 MyHandler2 的 url 可以这些写：

QF.ajaxPostForm({
  url: 'MyHandler1', // 内部会去自动构造完整 url，而且如果当前页面有 queryString，url 里会自动把 queryString 都带上
  success: function (res) {
    if (res.code == 0) {
      QF.notifySelf('操作成功');
    } else {
      QF.notifySelf('操作失败：' + res.msg, -1);
    }
  }
});

支持提交前先弹出确认框让用户确认，并且支持二次确认，选项里加上 confirmMsg: 'xxx' 即可：

// 提交前先确认
QF.ajaxPostForm({
  confirmMsg: '确定执行吗？',
  url: '~/api/MyTest/Test1',
  success: function (res) {
    console.log(res);
  }
});

// 二次确认，confirmMsg 传入字符串数组即可
QF.ajaxPostForm({
  confirmMsg: ['确定执行吗？', '请再次确认要执行吗？'],
  url: '~/api/MyTest/Test1',
  success: function (res) {
    console.log(res);
  }
});

可指定在提交时在哪个控件上层遮罩显示 loading 动画，选项里加上 showLoadingCtrl: F.ui.XXX 即可。
若选项里没有指定 showLoadingCtrl，将从 QF.showLoadingCtrl 获取，若仍然没有，动画将不会显示。
另外，如果 loading 动画显示了，而且你提供了 complete 方法，则你需要自行在 complete 方法隐藏动画。
内有对 Session 过期的判断，若发现 Session 过期了，将会弹出错误消息框提示用户，并引导用户去重新登录：

如果你不希望做这个判断，选项里传入 doNotCheckSessionTimeout: true 即可。

render 函数

QF 提供了若干渲染函数，可直接给表格列的 RendererFunction 使用，或者在你自己的 js 渲染函数里调用：

F.ExtGeneralGrid(true, false)
  ...
  .Columns(
    F.RenderFieldFor(m => m.TestMenuItems.First().Name),
    F.RenderFieldFor(m => m.TestMenuItems.First().NavigateUrl).RendererFunction("QF.renderRelUrlLink"),
    F.RenderFieldFor(m => m.TestMenuItems.First().SuperAdminOnly).RendererFunction("QF.renderYesBoldHighlight"),
    F.RenderFieldFor(m => m.TestMenuItems.First().Hidden).RendererFunction("QF.renderNoBold"),
    F.RenderFieldFor(m => m.TestMenuItems.First().AttributeDataTag),
    F.RenderFieldFor(m => m.TestMenuItems.First().NodeId)
  )
  ...

这些函数有：

函数	功能	说明
`QF.renderYesNo` `QF.renderYesBold`/`QF.renderYesHighlight`/`QF.renderYesBoldHighlight` `QF.renderNoBold`/`QF.renderNoHighlight`/`QF.renderNoBoldHighlight`	渲染布尔字段，显示为 '是'/'否'	支持布尔、数值字段。对于数值字段，`0` 表示 `false`，非 `0` 表示 `true`。可对 '是'/'否' 进行加粗或高亮显示，使用对应函数即可。
`QF.renderEncodedString`	将字段值 HTML 编码后显示
`QF.renderRelUrlLink`/`QF.renderAbsUrlLink`	渲染超链字段	`renderRelUrlLink` 里会先把相对 url 转为绝对地址，`renderAbsUrlLink` 里则不会，字段值是啥就显示啥。

浮动面板

openFloatingPanel
打开浮动面板，并返回面板 id。
QF.openFloatingPanel(options) ⇒ string

选项有：

Name	Type	Default	Description
target	`string`	'self'	面板目标位置：'self'/'parent'/'top'
position	`string`	'right'	面板在页面的停靠位置：'left'/'right'/'top'/'bottom'
width	`number` \| `string`		指定停靠在页面左侧、右侧时面板的宽度，可接受的值：500/'500'/'500px'/'80%'
height	`number` \| `string`		指定停靠在页面顶部、底部时面板的高度，可接受的值同 `width`
title	`string`		面板标题
contentEl	`string` \| `jQueryElement` \| `DOMElement`		指定面板内容为页面上的某个元素，可传入 jQuery selector/jQuery元素/DOM元素
contentHtml	`string`		指定面板内容为一段 HTML
contentUrl	`string`		指定面板内容为另一个页面：将在面板内创建一个 iframe 来嵌入该页面
showTitle	`boolean`	`true`	是否显示标题栏
showCloseButton	`boolean`	`true`	标题栏上是否显示关闭按钮
showOverlay	`boolean`	`true`	是否显示遮罩层
closeOnOverlayClick	`boolean`	`false`	指示当显示遮罩层时，点击它时是否关闭面板
closeOnEsc	`boolean`	`false`	指示按 ESC 键时是否关闭面板
cssClass	`string`		面板额外的 css class
autoCloseDelay	`number`		自动关闭的延迟时长，单位：毫秒。大于零表示面板将在指定时长后自动关闭
animationDuration	`number`	`300`	面板动画时长，单位：毫秒
zIndexBase	`number`	`2000`	面板 z-index 基数，创建面板时的 z-index 将在此基数基础上依次增加
onClose	`function`		面板关闭时的回调函数，原型：`function(panelId, options) { }`

面板内容设置的优先级为：contentEl > contentHtml > contentUrl。
contentUrl 建议设置为以 ~/ 打头的相对地址如：'~/path/page'，内部会自动将其转为绝对地址，这样可确保在哪调用都不会有问题。已禁止外部网址。

简化调用版本：
QF.openFloatingPanel(title, contentUrl, [width]) ⇒ string
将在当前页面的右侧打开嵌入了指定页面的浮动面板。

Example

QF.openFloatingPanel('Test', '~/path/page', 500);

QF.openFloatingPanel({
  title:'Test', 
  width: 300,
  contentEl: '#myHidden'
});

QF.openFloatingPanel({
  target: 'parent',
  position: 'bottom',
  title:'Test', 
  height: '30%',
  contentHtml: '<h3>这是 html 内容</h3>'
});

浮动面板选项的默认值存储在 QF.floatingPanelDefaults，可在当前页面加载时修改：

F.ready(function () {
  // 修改当前页面浮动面板默认选项：点击遮罩层或按下 ESC 键将关闭面板
  QF.floatingPanelDefaults.closeOnOverlayClick = true;
  QF.floatingPanelDefaults.closeOnEsc = true;
});

closeFloatingPanel
QF.closeFloatingPanel(panelId, [noCloseEvent])
关闭当前页面里的指定面板。

Param	Type	Default	Description
panelId	`string`		面板 id
[noCloseEvent]	`boolean`	`false`	指示关闭时是否禁止调用 `onClose`

closeTopFloatingPanel
QF.closeTopFloatingPanel([noCloseEvent])
关闭当前页面里的顶层面板。

Param	Type	Default	Description
[noCloseEvent]	`boolean`	`false`	指示关闭时是否禁止调用 `onClose`

重复调用此方法将依次关闭各个面板。

closeAllFloatingPanels
QF.closeAllFloatingPanels([noCloseEvent])
关闭当前页面里的所有面板。

Param	Type	Default	Description
[noCloseEvent]	`boolean`	`false`	指示关闭时是否禁止调用 `onClose`

getTopFloatingPanelId
QF.getTopFloatingPanelId() ⇒ string | null
获取当前页面里的顶层面板的 id。

isHostingInFloatPanel
QF.isHostingInFloatPanel() ⇒ boolean
检查当前页面是否是在浮动面板里打开的。

getHostingFloatPanelId
QF.getHostingFloatPanelId() ⇒ string | null
若当前页面是在浮动面板里打开的，返回对应面板的 id，否则返回 null。

getHostingFloatPanelTrigger
QF.getHostingFloatPanelTrigger() ⇒ window | null
当当前页面是在浮动面板里打开的时，返回打开该浮动面板的上下文 window 对象，否则返回 null。

生成超链相关函数

QF 提供了若干用来生成文本/图片超链 HTML 的函数，可在你自己的 js 渲染函数里调用。
对于有 url 的参数，要传入相对地址，请以 '~/' 打头，如：'~/path/page'。

genRelUrlTxtLink/genAbsUrlTxtLink
生成文本链接。
QF.genRelUrlTxtLink(url, [txt], [title], [cssClass])
QF.genAbsUrlTxtLink(url, [txt], [title], [cssClass])

Param	Type	Default	Description
url	`string`		URL
[txt]	`string`	同 `url`	链接文本，内部会对其进行 HTML 编码
[title]	`string`		链接标题
[cssClass]	`string`		CSS类名

url 可以是：

相对 url 或绝对 url。genRelUrlTxtLink 里会把相对 url 转为绝对 url，genAbsUrlTxtLink 则不会，url 被原样使用。
javascript: 打头的 js，如："javascript:myFunc(123, 'abc')"。注意若函数有字符串参数，请用单引号包裹。

genRelUrlImgLink/genAbsUrlImgLink
生成图片链接。
QF.genRelUrlImgLink(url, icon, [title], [cssClass])
QF.genAbsUrlImgLink(url, icon, [title], [cssClass])

Param	Type	Description
url	`string`	URL
icon	`string`	图标
[title]	`string`	链接标题
[cssClass]	`string`	CSS类名

url 可以是：

相对 url 或绝对 url。genRelUrlImgLink 里会把相对 url 转为绝对 url，genAbsUrlImgLink 则不会，url 被原样使用。
javascript: 打头的 js，如："javascript:myFunc(123, 'abc')"。注意若函数有字符串参数，请用单引号包裹。

icon 可以是：

img 元素 HTML：'<img alt="xxx" src="/imgs/xxx.png"></img>'
图片地址：相对地址：'~/imgs/xxx.png'，或绝对地址：'/imgs/xxx.png/'。相对图片地址将被自动转为绝对地址。
FineUICore 图标名称：如 'Add'、'anchor' 等等(不区分大小写)。可用图标名称参见这里open in new window。

genJsTxtLink
生成点击时执行指定 js 函数的文本链接。
QF.genJsTxtLink(jsFunc, txt, [title], [cssClass])

Param	Type	Description
jsFunc	`string`	js 函数调用代码，或 js 函数名称。注意若函数调用有字符串参数，请用单引号包裹。
txt	`string`	链接文本，内部会对其进行 HTML 编码
[title]	`string`	链接标题
[cssClass]	`string`	CSS类名

jsFunc 可传入 null 或空白，此时将不会有 onclick 事件注册，你可利用 cssClass 自行进行事件注册。

genJsImgLink
生成点击时执行指定 js 函数的图片链接。
QF.genJsImgLink(jsFunc, icon, [title], [cssClass])

Param	Type	Description
jsFunc	`string`	js 函数调用代码，或 js 函数名称。注意若函数调用有字符串参数，请用单引号包裹。
icon	`string`	图标
[title]	`string`	链接标题
[cssClass]	`string`	CSS类名

jsFunc 可传入 null 或空白，此时将不会有 onclick 事件注册，你可利用 cssClass 自行进行事件注册。

icon 可以是：

img 元素 HTML：'<img alt="xxx" src="/imgs/xxx.png"></img>'
图片地址：相对地址：'~/imgs/xxx.png'，或绝对地址：'/imgs/xxx.png/'。相对图片地址将被自动转为绝对地址。
FineUICore 图标名称：如 'Add'、'anchor' 等等(不区分大小写)。可用图标名称参见这里open in new window。

genDisabledTxtLink
生成禁用状态的文本链接。
QF.genDisabledTxtLink(txt, [cssClass], [title])

Param	Type	Description
txt	`string`	链接文本，内部会对其进行 HTML 编码
[cssClass]	`string`	CSS类名
[title]	`string`	链接标题

genDisabledImgLink
生成禁用状态的图片链接。
QF.genDisabledImgLink(icon, [cssClass], [title])

Param	Type	Description
icon	`string`	图标
[cssClass]	`string`	CSS类名
[title]	`string`	链接标题

icon 可以是：

img 元素 HTML：'<img alt="xxx" src="/imgs/xxx.png"></img>'
图片地址：相对地址：'~/imgs/xxx.png'，或绝对地址：'/imgs/xxx.png/'。相对图片地址将被自动转为绝对地址。
FineUICore 图标名称：如 'Add'、'anchor' 等等(不区分大小写)。可用图标名称参见这里open in new window。

genDownloadTxtLink
生成下载文本链接。
QF.genDownloadTxtLink(url, [cssClass], [txt])

Param	Type	Default	Description
url	`string`		下载URL。若为相对 url，将被转为绝对地址
[cssClass]	`string`		CSS类名
[txt]	`string`	'下载'	链接文本，内部会对其进行 HTML 编码

genDownloadImgLink
生成下载图片链接。
QF.genDownloadImgLink(url, [cssClass], [icon], [title])

Param	Type	Default	Description
url	`string`		下载URL。若为相对 url，将被转为绝对地址
[cssClass]	`string`		CSS类名
[icon]	`string`	内置的一个下载图标	图标
[title]	`string`		链接标题

icon 可以是：

img 元素 HTML：'<img alt="xxx" src="/imgs/xxx.png"></img>'
图片地址：相对地址：'~/imgs/xxx.png'，或绝对地址：'/imgs/xxx.png/'。相对图片地址将被自动转为绝对地址。
FineUICore 图标名称：如 'Add'、'anchor' 等等(不区分大小写)。可用图标名称参见这里open in new window。

appendHighlightedJson

QF.appendHighlightedJson(container, json, [space], [forceReParse])
向容器追加高亮显示 JSON 的 HTML。

Param	Type	Default	Description
container	`jQueryElement`		目标容器元素
json	`object` \| `string`		要显示的对象或字符串
[space]	`number`	`2`	缩进空格数
[forceReParse]	`boolean`	`false`	是否强制重新解析

内部调用了 QF.jsonHighlighting() 取得高亮 JSON 的 HTML。

Example

QF.appendHighlightedJson($('.my-json-area'), myObj);

appendItemsToDDLWithObjects

QF.appendItemsToDDLWithObjects(ddlCtrlOrID, objs)
把传入的对象作为下拉项追加到下拉列表里，并把这些项追加选中。
适用于多选下拉列表。

Param	Type	Description
ddlCtrlOrID	`string` \| `Element`	下拉列表ID 或下拉列表控件
objs	`object` \| `Array.<object>`	对象或对象数组

将识别传入对象的以下属性值作为下拉项的值：obj.id || obj.Id || obj.ID || obj.value || obj.Value || obj.VALUE || obj.val || obj.Val || obj.VAL
将识别传入对象的以下属性值作为下拉项的显示文本：obj.name || obj.Name || obj.NAME || obj.displayName || obj.DisplayName || obj.DISPLAYNAME || obj.text || obj.Text || obj.TEXT || obj.txt || obj.Txt || obj.TXT

Example

QF.appendItemsToDDLWithObjects('myddl', { id: '123', name: 'abc' });
QF.appendItemsToDDLWithObjects(F('myddl'), [
  { id: '1', displayName: 'a' },
  { id: '2', displayName: 'b' },
  { id: '3', displayName: 'c' },
  { id: '4', displayName: 'd' },
]);

appendQuery

QF.appendQuery(url, s) ⇒ string
向 URL 追加查询字符串。

Param	Type	Description
url	`string`	原始 URL
s	`string`	要追加的查询字符串

Example

QF.appendQuery('/page', 'id=123');       // 返回 '/page?id=123'
QF.appendQuery('/page?q=abc', 'id=123'); // 返回 '/page?q=abc&id=123'

checkBoxListGetSelection

QF.checkBoxListGetSelection(ctrlID) ⇒ Array.<string>
获取复选框列表的选中项的值数组。

Param	Type	Description
ctrlID	`string`	复选框列表控件ID

checkBoxListSelectAll

QF.checkBoxListSelectAll(ctrlID)
全选复选框列表。

Param	Type	Description
ctrlID	`string`	复选框列表控件ID

checkBoxListSelectInvert

QF.checkBoxListSelectInvert(ctrlID)
反选复选框列表。

Param	Type	Description
ctrlID	`string`	复选框列表控件ID

closeSelf

QF.closeSelf([noCloseEvent])
关闭当前页面自己。

Param	Type	Default	Description
[noCloseEvent]	`boolean`	`false`	指示关闭时是否禁用对应关闭事件。具体事件由页面打开方式决定。

将自动检测页面打开方式并尝试关闭自己。
若是在 TAB 标签里打开的，将关闭所在标签；若是弹窗打开的，将关闭所在窗口；若是在浮动面板打开的，将关闭所在面板；若是用 window.open() 打开的，将用 window.close() 关闭。

copyToClipboard

QF.copyToClipboard(txt, [bTip]) ⇒ boolean
复制文本到剪贴板。返回 true 表示复制成功，false 表示复制失败。

Param	Type	Default	Description
txt	`string`		要复制的文本
[bTip]	`boolean`	`true`	指示是否显示复制结果通知。若为 `true`，将会调用 `QF.notifySelf()` 通知复制结果

fromBase64

QF.fromBase64(s) ⇒ string
将Base64编码的字符串解码。

Param	Type	Description
s	`string`	Base64编码的字符串

getAbsUrl

QF.getAbsUrl(relUrl) ⇒ string
获取相对URL的，包含基路径的绝对URL。

Param	Type	Description
relUrl	`string`	相对URL，如 '~/path/page'

若 relUrl 本身为绝对URL，直接返回其自己。

Example

// 假设当前页面是 ~/Samples/SimplePage1，应用部署在子目录 QSample 下
QF.getAbsUrl('~/path/page'); // 返回 '/QSample/path/page'
QF.getAbsUrl('/path/page');  // 返回 '/path/page'
QF.getAbsUrl('path/page');   // 返回 '/QSample/Samples/path/page'

getDDLSelIndex

QF.getDDLSelIndex(ddlCtrl, [returnNullWhenNoSel]) ⇒ number | null
获取下拉列表所选项的索引。
只适用于单选下拉列表。

Param	Type	Default	Description
ddlCtrl	`FineUICoreCtrl`		下拉列表控件
[returnNullWhenNoSel]	`boolean`	`false`	无选中项时是否返回null

无选中项时，若 returnNullWhenNoSel==true，返回 null，否则返回 -1。

getDDLText

QF.getDDLText(ddlCtrl) ⇒ string | null
获取下拉列表里的文本。返回文本或 null。

Param	Type	Description
ddlCtrl	`FineUICoreCtrl`	下拉列表控件

getDDLValue

QF.getDDLValue(ddlCtrl) ⇒ string | null
获取下拉列表所选值。返回所选值或 null。
对于多选下拉列表，若未选取任何项，将返回 null。

Param	Type	Description
ddlCtrl	`FineUICoreCtrl`	下拉列表控件

对于单选下拉列表，内部有检查，确保返回的值是下列选项里的。

getDPDayString

QF.getDPDayString(dpCtrl) ⇒ string | null
获取日期控件的选取日期，并返回为日期字符串，格式为 'yyyy-MM-dd'。
若未选日期，返回 null。

Param	Type	Description
dpCtrl	`FineUICoreCtrl`	日期控件

QF.getDPDayString(F.ui.dpBegin); // 返回示例：'2022-09-01'

getDPDateTimeString

QF.getDPDateTimeString(dpCtrl, [isEndTime], [timePartCtrl]) ⇒ string | null
获取日期控件的选取日期，并根据输入参数追加时间部分，最后返回完整的日期时间字符串。返回格式为：'yyyy-MM-dd HH:mm:ss'。
若未选日期，返回 null。

Param	Type	Default	Description
dpCtrl	`FineUICoreCtrl`		日期控件
[isEndTime]	`boolean`	`false`	是否为结束时间
[timePartCtrl]	`FineUICoreCtrl`		时间部分控件

时间部分处理规则：
当未提供 timePartCtrl 时：isEndTime==true 时时间部分将为 '23:59:59'，否则将为 '00:00:00'。
当提供 timePartCtrl 了时：时间部分将先取其值。如果有缺失部分(比如只有小时，或者有小时、分钟，没有秒)，将根据 isEndTime 去追加 '59' 或 '00'。

Example

QF.getDPDateTimeString(F.ui.dpBegin);     // 返回示例：'2022-09-01 00:00:00'
QF.getDPDateTimeString(F.ui.dpEnd, true); // 返回示例：'2022-09-08 23:59:59'

getDPDateTime

QF.getDPDateTime(dpCtrl, [isEndTime], [timePartCtrl]) ⇒ Date | null
获取日期控件的选取日期，返回 Date 对象。
若未选日期，返回 null。

Param	Type	Default	Description
dpCtrl	`FineUICoreCtrl`		日期时间选择器控件
[isEndTime]	`boolean`	`false`	是否为结束时间
[timePartCtrl]	`FineUICoreCtrl`		时间部分控件

时间部分处理规则同 getDPDateTimeString()。

getGridSelCellData

QF.getGridSelCellData([gridCtrlOrID]) ⇒ object | null
获取表格选中单元格的相关数据。无选中时返回 null。

Param	Type	Default	Description
[gridCtrlOrID]	`string` \| `Element`	'gridCtrl'	表格控件ID 或表格控件

返回的对象的属性有：

Name	Description
rowId	所在行的记录 id 值
colName	所在列的名称
colVal	单元格对应值

getGridSelectedRowDatas

QF.getGridSelectedRowDatas([gridCtrlOrID]) ⇒ Array.<object>
获取表格中所有选中行的行数据数组。无选中行时返回空数组。

Param	Type	Default	Description
[gridCtrlOrID]	`string` \| `Element`	'gridCtrl'	表格控件ID 或表格控件

getGridSelectedRowIds

QF.getGridSelectedRowIds([gridCtrlOrID]) ⇒ Array.<string>
获取表格中所有选中行的行 id 值数组。无选中行时返回空数组。

Param	Type	Default	Description
[gridCtrlOrID]	`string` \| `Element`	'gridCtrl'	表格控件ID 或表格控件

getNodeTextPath

QF.getNodeTextPath(childNodeID, [treeCtrlOrID], [getFullPath]) ⇒ string
获取树控件指定节点的文本路径。

Param	Type	Default	Description
childNodeID	`string`		子节点ID
[treeCtrlOrID]	`string` \| `Element`	'treeCtrl'	树控件ID 或树控件
[getFullPath]	`boolean`	`false`	指示是否获取完整路径

getFullPath 为 false 时，返回的文本路径将不包含根节点。例如对以下树：

├─系统管理(n1)
  └─系统配置(n2)
    └─系统菜单(n3)
    └─快速链接(n4)

QF.getNodeTextPath('n3');                   // 返回：'系统配置/系统菜单'
QF.getNodeTextPath('n3', 'treeCtrl', true); // 返回：'系统管理/系统配置/系统菜单'

getNumericValue

QF.getNumericValue(numCtrl) ⇒ number | null
获取数值控件的值。

Param	Type	Description
numCtrl	`FineUICoreCtrl`	数值控件(或其它控件)

若控件值的不是有效数值，返回 null。

getQueryString

QF.getQueryString(name) ⇒ string | null
获取当前页面查询字符串里指定的参数值。

Param	Type	Description
name	`string`	参数名

返回的值已被用 decodeURIComponent() 解码。

ifNull

QF.ifNull(v1, v2) ⇒ *
如果第一个值为null则返回第二个值。

Param	Type	Description
v1	`*`	第一个值
v2	`*`	第二个值

如果俩个都为 null，返回空字符串，即始终不会返回 null。

Example

QF.ifNull(123, 456);          // 返回 123
QF.ifNull(null, 'abc');       // 返回 'abc'
QF.ifNull(undefined, 'abc');  // 返回 'abc'
QF.ifNull('', 'abc');         // 返回 ''
QF.ifNull(undefined, null);   // 返回 ''

ifNullOrEmpty

QF.ifNullOrEmpty(v1, v2) ⇒ *

如果第一个值为null或空字符串则返回第二个值。

Param	Type	Description
v1	`*`	第一个值
v2	`*`	第二个值

注意与 ifNull() 的区别，有可能返回 null。

Example

QF.ifNullOrEmpty(123, 456);          // 返回 123
QF.ifNullOrEmpty(null, 'abc');       // 返回 'abc'
QF.ifNullOrEmpty(undefined, 'abc');  // 返回 'abc'
QF.ifNullOrEmpty('', 'abc');         // 返回 'abc'
QF.ifNullOrEmpty(undefined, null);   // 返回 null

jsonHighlighting

QF.jsonHighlighting(json, [space], [forceReParse]) ⇒ string
对 JSON 进行语法高亮处理，并返回加了高亮显示的 HTML。

Param	Type	Default	Description
json	`object` \| `string`		要处理的对象或 JSON 字符串
[space]	`number`	`2`	缩进空格数
[forceReParse]	`boolean`	`false`	是否强制重新解析

若输入是对象，将用 JSON.stringify(json) 转为字符串。
若输入是字符串，且 forceReParse 为 true，将先用 JSON.parse(json) 取得 JSON 对象，再用 JSON.stringify() 转为字符串。
高亮效果参见内置的 已注册 CRUDProxy 列表 页面。

replaceWithHighlightedJson

QF.replaceWithHighlightedJson(container, json, [space], [forceReParse])
用高亮显示 JSON 的 HTML 替换容器内容。

Param	Type	Default	Description
container	`jQueryElement`		目标容器元素
json	`object` \| `string`		要显示的对象或字符串
[space]	`number`	`2`	缩进空格数
[forceReParse]	`boolean`	`false`	是否强制重新解析

内部调用了 QF.jsonHighlighting() 取得高亮 JSON 的 HTML。

Example

QF.replaceWithHighlightedJson($('.my-json-area'), myObj);

resetDDLAndForceSetValue

QF.resetDDLAndForceSetValue(ddlCtrlOrID, value, [text])
重置下拉列表并强制选中指定的数据。
下拉列表里原有的选项将被清除，然后加入传入的项目并将其选中。
适用于单选下拉列表。

Param	Type	Description
ddlCtrlOrID	`string` \| `Element`	下拉列表ID 或下拉列表控件
value	`string`	要选中的值
[text]	`string`	显示的文本，若未提供将与 `value` 相同

resetInputCtrls

QF.resetInputCtrls(ctrls)
重置输入控件。

Param	Type	Description
ctrls	`Array.<FineUICoreCtrl>`	控件数组

function resetFilter() {
  QF.resetInputCtrls([
    F.ui.ddlDeptRecursive,
    F.ui.ddlIsLocked,
    F.ui.ddlDataItem1Name,
    F.ui.ddlDataItem1Value
  ]);
}

safeOpenUrl

QF.safeOpenUrl(url, [noReferrer], [target]) ⇒ object
安全打开指定 url 并返回 window 对象。

Param	Type	Default	Description
url	`string`		url 地址
[noReferrer]	`boolean`	`false`	指示是否要让浏览器省略 Referer 标头
[target]	`string`	'_blank'

此方法可用来安全打开外部 url 网址。
当 url 是 'http:'、'https:' 打头的地址时认为是外部网址，将确保打开的页面内取不到 opener，若 noReferrer 传入 true，则同时确保其取不到 referrer。
对于其它 url 将不做什么处理，效果等同 window.open(url)。

selectGridRow

QF.selectGridRow(id, [gridCtrlOrID])
选取表格中指定的行。

Param	Type	Default	Description
id	`string`		要选取的行的 id 值
[gridCtrlOrID]	`string` \| `Element`	'gridCtrl'	表格控件ID 或表格控件

与表格自带的 selectRow() 方法的区别是：QF.selectGridRow() 会先检查列表里有没有 id 为指定值的行。

setGridCellVals

QF.setGridCellVals(id, data, [gridCtrlOrID]) ⇒ boolean
设置表格指定行的单元格的值。返回 true 表示设置成功，false 表示设置失败。

Param	Type	Default	Description
id	`string`		要设置的行的 id 值
data	`object` \| `string`		包含列名和值的对象。也可以是 JSON 字符串
[gridCtrlOrID]	`string` \| `Element`	'gridCtrl'	表格控件ID 或表格控件

其中有对包含渲染函数的列以及扩展列的处理。

showWindow

QF.showWindow(urlOrOptions, [winTitle], [winCtrlOrID])
显示 iframe 窗口。窗体控件需要确保启用 IFrame。

Param	Type	Default	Description
urlOrOptions	`string` \| `object`		iframe 的 Url 字符串或配置对象
[winTitle]	`string`		窗口标题
[winCtrlOrID]	`string` \| `Element`	'winCtrl'	窗口控件ID 或窗口控件

当 urlOrOptions 为配置对象时，后边参数将被忽略。其中的配置项有：

Name	Type	Default	Description
url	`string`		iframe 的 Url
title	`string`		窗口标题
[width]	`number`		窗口宽度
[height]	`number`		窗口高度
[maximized]	`boolean`	`false`	是否最大化显示(前提：窗口控件启用了最大化)
[ctrlID]	`string`	'winCtrl'	窗口控件ID

url 支持传入相对地址如 "~/path/page"，内部将自动将其转换为绝对地址，确保了不论在哪调用都可以。

QF.showWindow('~/path/page', '页面标题');
QF.showWindow({
  url: '~/path/page',
  title: '页面标题',
  width: 800,
  height: 600
});

toBase64

QF.toBase64(s) ⇒ string
将字符串转换为Base64编码。

Param	Type	Description
s	`string`	要编码的字符串

toBase64Image

QF.toBase64Image(imgDom, [type]) ⇒ string
将图片转换为Base64编码图片字符串。

Param	Type	Default	Description
imgDom	`HTMLElement`		图片DOM元素
[type]	`string`	'png'	图像类型：'png' 或 'jpeg'

toFixedOrInt

QF.toFixedOrInt(number, scale) ⇒ string
把数值转换为固定小数位数或整数字符串。

Param	Type	Default	Description
number	`number`		要转换的数值
scale	`number`	`0`	小数位数

不会返回小数点后全为 0 的结果，见示例：

QF.toFixedOrInt(1.23456, 2);   // 返回 '1.23'
QF.toFixedOrInt(5.6789, 2);    // 返回 '5.68'
QF.toFixedOrInt(1.23456, 0);   // 返回 '1'
QF.toFixedOrInt(5.6789, 0);    // 返回 '6'
QF.toFixedOrInt(1.23, 3);      // 返回 '1.230'
QF.toFixedOrInt(123, 3);       // 返回 '123'
QF.toFixedOrInt(1.999, 2);     // 返回 '2'

toggleParentCellsCssInTreeGrid

QF.toggleParentCellsCssInTreeGrid(rowId, [gridCtrlOrID], [cssClassName])
切换树形表格中，指定行的所有树字段对应父单元格的 CSS 类。

Param	Type	Default	Description
rowId	`string`		所在行的记录 id 值
[gridCtrlOrID]	`string` \| `Element`	'gridCtrl'	表格控件ID 或表格控件
[cssClassName]	`string`	'qf-grid-tree-parent'	要切换的CSS类名

此方法通常用来在树形表格列表里，高亮显示用户当前选取的行的，所有父行里的树字段对应的单元格，以方便看到节点路径：响应表格控件的 rowselect 客户端事件，在其中调用此方法：

function onGridRowSelect(e, rowId, rowIndex) {
  QF.toggleParentCellsCssInTreeGrid(rowId);
}

toggleParentNodesCss

QF.toggleParentNodesCss(treeCtrlOrID, childNodeID, [getFullPath], [cssClassName]) ⇒ string
切换树控件中指定字节的所有父节点的 CSS 类，同时返回该节点的文本路径。

Param	Type	Default	Description
treeCtrlOrID	`string` \| `Element`		树控件ID 或树控件(注意没有默认值，必须传入)
childNodeID	`string`		子节点ID
[getFullPath]	`boolean`	`false`	指示是否获取完整路径，参见 `getNodeTextPath()` 方法说明
[cssClassName]	`string`	'qf-tree-parent'	要切换的CSS类名

此方法通常用来高亮显示用户当前选取的节点的所有父节点，以方便看到节点路径：响应树控件的 nodeselect 客户端事件，在其中调用此方法：

function onTreeNodeSelect(e, nodeId) {
  var nodeTextPath = QF.toggleParentNodesCss('treeCtrl', nodeId);
  ...
}

toQueryString

QF.toQueryString(o, [noEmpty]) ⇒ string
将对象转换为查询字符串。

Param	Type	Default	Description
o	`object`		要转换的对象
[noEmpty]	`boolean`	`true`	是否忽略空值

若 noEmpty==true，将忽略 o 里值为 null 或空字符串的属性。
始终不会返回 null，若无有效属性，将返回空字符串 ''。
属性值已被用 encodeURIComponent() 编码。

triggerSelectUser

QF.triggerSelectUser(userDDL, [options])
触发用户选取对话框。
将弹出内置的用户选取页面，并把选取结果自动填充到指定的下拉列表控件里。之前已选的用户还会被高亮显示。

Param	Type	Description
userDDL	`string` \| `Element`	接收选取结果的下拉列表控件，可为控件ID 或控件元素
[options]	`object`	选项

options 中的选项有：

Name	Type	Description
[deptCtrl]	`string` \| `Element`	部门控件ID或部门控件(通常为一个部门下拉列表)。若提供了此选项，表示将要从 `deptCtrl` 所选的部门里选取用户，若尚未选部门，会弹出提示，提示内容则由 `noDeptTips` 选项指定
[noDeptTips]	`string`	尚未选部门时的提示信息，若未提供将使用一个默认提示
[deptId]	`string`	部门ID值，指示要从哪个部门里选取用户。`deptCtrl` 和 `deptId` 选项不要同时提供。若传入空白字符串，将从当前用户有权的部门里选取
[multiSelect]	`boolean`	指示是否多选，默认 `false`。注意若要多选，确保 `userDDL` 是一个多选下拉列表
[title]	`string`	窗口标题，若未提供将使用一个默认标题
[width]	`number`	窗口宽度，若未提供将为当前页面里窗体控件的初始宽度
[height]	`number`	窗口高度，若未提供将为当前页面里窗体控件的初始高度

若未提供 options，将从当前用户有权的部门里单选用户。
注：内置的用户选取页面里会进行权限比对，若当前用户无所传部门权限，将不会有用户列出。

# QF 参考

# Properties

# appVer

# curLang

# curTheme

# handlerFormat

# isBuiltIn

# loginPage

# notifyDefaultPositionX

# notifyDefaultPositionY

# openBuiltInPageInFloatingPanel

# path

# pathBase

# queryString

# routeValues

# showLoadingCtrl

# version

# Methods

# notify 方法

# alert 方法

# confirm 方法

# post 方法

# render 函数

# 浮动面板

# 生成超链相关函数

# appendHighlightedJson

# appendItemsToDDLWithObjects

# appendQuery

# checkBoxListGetSelection

# checkBoxListSelectAll

# checkBoxListSelectInvert

# closeSelf

# copyToClipboard

# fromBase64

# getAbsUrl

# getDDLSelIndex

# getDDLText

# getDDLValue

# getDPDayString

# getDPDateTimeString

# getDPDateTime

# getGridSelCellData

# getGridSelectedRowDatas

# getGridSelectedRowIds

# getNodeTextPath

# getNumericValue

# getQueryString

# ifNull

# ifNullOrEmpty

# jsonHighlighting

# replaceWithHighlightedJson

# resetDDLAndForceSetValue

# resetInputCtrls

# safeOpenUrl

# selectGridRow

# setGridCellVals

# showWindow

# toBase64

# toBase64Image

# toFixedOrInt

# toggleParentCellsCssInTreeGrid

# toggleParentNodesCss

# toQueryString

# triggerSelectUser

QF 参考

Properties

appVer

curLang

curTheme

handlerFormat

isBuiltIn

loginPage

notifyDefaultPositionX

notifyDefaultPositionY

openBuiltInPageInFloatingPanel

path

pathBase

queryString

routeValues

showLoadingCtrl

version

Methods

notify 方法

alert 方法

confirm 方法

post 方法

render 函数

浮动面板

生成超链相关函数

appendHighlightedJson

appendItemsToDDLWithObjects

appendQuery

checkBoxListGetSelection

checkBoxListSelectAll

checkBoxListSelectInvert

closeSelf

copyToClipboard

fromBase64

getAbsUrl

getDDLSelIndex

getDDLText

getDDLValue

getDPDayString

getDPDateTimeString

getDPDateTime

getGridSelCellData

getGridSelectedRowDatas

getGridSelectedRowIds

getNodeTextPath

getNumericValue

getQueryString

ifNull

ifNullOrEmpty

jsonHighlighting

replaceWithHighlightedJson

resetDDLAndForceSetValue

resetInputCtrls

safeOpenUrl

selectGridRow

setGridCellVals

showWindow

toBase64

toBase64Image

toFixedOrInt

toggleParentCellsCssInTreeGrid

toggleParentNodesCss

toQueryString

triggerSelectUser