126 lines
4.0 KiB
HTML
126 lines
4.0 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>查询配置面板预览（调试用，验证完删除）</title>
|
|
<style>
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
margin: 0;
|
|
}
|
|
body {
|
|
background: #f1f3f6;
|
|
}
|
|
/* 复刻 module-management 右栏的 .mm-config-pane：面板就挂在这个滚动容器里 */
|
|
#pane {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
min-height: 0;
|
|
overflow: auto;
|
|
padding: 12px 16px 16px;
|
|
box-sizing: border-box;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="pane"></div>
|
|
<script type="module">
|
|
import { createApp, h, ref } from 'vue'
|
|
import { createPinia } from 'pinia'
|
|
import { registerFeature, useAreaSelection } from 'stk-table-vue'
|
|
import 'stk-table-vue/lib/style.css'
|
|
import '/src/styles/index.css'
|
|
import ModuleQueryConfigPanel from '/src/views/module/module-management/ModuleQueryConfigPanel.vue'
|
|
|
|
registerFeature(useAreaSelection)
|
|
|
|
const fields = [
|
|
{ b_field: 'b_no', b_name: '单号', b_type: 'input', b_canuse: 1 },
|
|
{ b_field: 'b_company', b_name: '客户名称', b_type: 'input', b_canuse: 1 },
|
|
{ b_field: 'b_state', b_name: '运行状态', b_type: 'select', b_canuse: 1 },
|
|
{ b_field: 'b_audit_state', b_name: '审核状态', b_type: 'select', b_canuse: 1 },
|
|
{ b_field: 'b_amount', b_name: '金额', b_type: 'money', b_canuse: 1 },
|
|
{ b_field: 'b_date', b_name: '业务日期', b_type: 'date', b_canuse: 1 },
|
|
{ b_field: 'b_owner', b_name: '业务员', b_type: 'select', b_canuse: 1 },
|
|
{ b_field: 'b_remark', b_name: '备注', b_type: 'textarea', b_canuse: 0 },
|
|
]
|
|
|
|
const schema = ref({
|
|
schemaVersion: 3,
|
|
views: [
|
|
{ code: 'all', label: '全部', group: '', order: 10, showCount: true, isDefault: true, conditionSql: '' },
|
|
{
|
|
code: 'pending',
|
|
label: '待处理',
|
|
group: '运行状态',
|
|
order: 20,
|
|
showCount: true,
|
|
conditionSql: "[b_state] = N'待处理'",
|
|
},
|
|
{
|
|
code: 'sailed',
|
|
label: '已开航',
|
|
group: '运行状态',
|
|
order: 30,
|
|
showCount: false,
|
|
conditionSql: "[b_state] = N'已开航'",
|
|
},
|
|
{
|
|
code: 'audit_wait',
|
|
label: '待审核',
|
|
group: '审核状态',
|
|
order: 40,
|
|
showCount: true,
|
|
conditionSql: "[b_audit_state] = N'待审核' AND [b_amount] > 1000",
|
|
},
|
|
{
|
|
code: 'audit_done',
|
|
label: '已审核',
|
|
group: '审核状态',
|
|
order: 50,
|
|
showCount: false,
|
|
conditionSql: "[b_audit_state] = N'已审核'",
|
|
},
|
|
],
|
|
keywordSearch: { fields: ['b_no', 'b_company'] },
|
|
quickFilters: [
|
|
{ field: 'b_state', order: 10 },
|
|
{ field: 'b_date', order: 20 },
|
|
{ field: 'b_owner', order: 30 },
|
|
],
|
|
queryFields: {
|
|
b_no: { component: 'input', operator: 'like' },
|
|
b_company: { component: 'input', operator: 'like' },
|
|
b_state: { component: 'select', operator: 'eq' },
|
|
b_amount: { component: 'number', operator: 'ge' },
|
|
b_date: { component: 'date', operator: 'between' },
|
|
b_owner: { component: 'select', operator: 'eq' },
|
|
b_remark: { component: 'input', operator: 'like' },
|
|
},
|
|
})
|
|
|
|
const Preview = {
|
|
setup() {
|
|
return () =>
|
|
h(ModuleQueryConfigPanel, {
|
|
moduleId: 'demo',
|
|
fields,
|
|
loading: false,
|
|
modelValue: schema.value,
|
|
'onUpdate:modelValue': (value) => {
|
|
schema.value = value
|
|
},
|
|
})
|
|
},
|
|
}
|
|
|
|
const pinia = createPinia()
|
|
const app = createApp(Preview)
|
|
app.use(pinia)
|
|
app.mount('#pane')
|
|
</script>
|
|
</body>
|
|
</html>
|