Skip to content

csbr-daop / fe-data-trusted-space

Go to a project
Toggle navigation
Toggle navigation pinning
b30375b8 by lxs
Options

分级分类任务更新

1 parent f39ba7a0
Inline Side-by-side
Showing 2 changed files with 272 additions and 449 deletions
src/components/Table/index.vue
......@@ -48,8 +48,8 @@ const maxHeight = computed(() => {
return props.tableInfo.maxHeight
? props.tableInfo.maxHeight
: showPage.value
? "calc(100% - 44px)"
: "100%";
? "calc(100% - 44px)"
: "100%";
});
const multiple = computed(() => {
return props.tableInfo.multiple ?? false;
......@@ -123,7 +123,7 @@ const handleClick = (scope, btn) => {
if (scope.row.disabled || btn.disabled) return;
emits("tableBtnClick", scope, btn);
};
const popoverHover = (scope, btn)=>{
const popoverHover = (scope, btn) => {
emits("tableBtnClick", scope, btn);
}
const selectionChange = (val) => {
......@@ -158,7 +158,7 @@ const inputKeyUp = (regexp, scope, item) => {
return;
}
if (regexp) {
scope.row[field] = scope.row[field].replace(regexp,'')
scope.row[field] = scope.row[field].replace(regexp, '')
}
// 特殊处理，apiCreate.vue中defaultParamsTableInfo的pageSize限制输入最大值100.
if (scope.row.paramName == 'pageSize' && scope.row[field] > 100) {
......@@ -175,7 +175,7 @@ const rowClassName = (rowObj) => {
}
const row = rowObj.row;
let className = "";
if (row.ROWID && row.STATUS === "edit" && row.STATE === "Running" ) {
if (row.ROWID && row.STATUS === "edit" && row.STATE === "Running") {
className = "edit_row";
}
return className;
......@@ -202,8 +202,8 @@ const pageChange = (page) => {
let info = { ...page, id: props.tableInfo.id };
emits("tablePageChange", info);
};
const tableRowClassName1 = ({row,rowIndex})=>{
return row.isAlter=="Y"? "primary":""
const tableRowClassName1 = ({ row, rowIndex }) => {
return row.isAlter == "Y" ? "primary" : ""
}
onMounted(() => {
......@@ -220,71 +220,33 @@ onMounted(() => {
</script>
<template>
<div
class="table_panel"
:id="props.tableInfo.id"
:style="{
height: props.tableInfo.height ?? '100%',
'min-height': props.tableInfo.minPanelHeight ?? ''
}"
>
<el-table
ref="tableRef"
:class="{ 'no-edit': props.tableInfo.readonly, 'sort-table': props.tableInfo.sortable }"
:data="tableData"
:highlight-current-row=" props.tableInfo.heightlightRow ?? true"
:show-header="props.tableInfo.showHeader ?? true"
stripe
:border="props.tableInfo.border
?? true" :height="props.tableInfo.height === null ? null : (props.tableInfo.height ?? '100%')"
:max-height="maxHeight"
:row-key="rowKey"
:current-row-key="currentRowKey"
:row-class-name="rowClassName"
v-loading="tableDataLoading"
@row-click="rowClick"
@row-dblclick="rowDblClick"
@selection-change="selectionChange"
@select="tableCheckboxSelectChange"
@select-all="tableCheckboxAllSelectChange"
style="width: 100%; display: inline-block"
:style="{ 'min-height': props.tableInfo.minHeight ?? '200px' }"
tooltip-effect="light"
:tooltip-options="{ placement: 'top', popperClass: 'table_cell_tooltip' }"
:show-summary="props.tableInfo.showSummary ?? false"
>
<el-table-column
type="selection"
:width="32"
align="center"
v-if="multiple"
:selectable="rowSelectable"
:fixed="fixedSelection"
/>
<el-table-column
v-for="item in tableFields"
:label="item.label"
:width="item.width"
:min-width="item.minWidth"
:fixed="item.fixed"
:align="item.align"
:type="item.type == 'index' ? '' : undefined"
:sortable="item.sortable ?? false"
:prop="item.field"
:class-name="item.columClass"
:show-overflow-tooltip="item.type != 'switch'"
>
<template #header>
<div class="table_panel" :id="props.tableInfo.id" :style="{
height: props.tableInfo.height ?? '100%',
'min-height': props.tableInfo.minPanelHeight ?? ''
}">
<el-table ref="tableRef" :class="{ 'no-edit': props.tableInfo.readonly, 'sort-table': props.tableInfo.sortable }"
:data="tableData" :highlight-current-row="props.tableInfo.heightlightRow ?? true"
:show-header="props.tableInfo.showHeader ?? true" stripe :border="props.tableInfo.border
?? true" :height="props.tableInfo.height === null ? null : (props.tableInfo.height ?? '100%')"
:max-height="maxHeight" :row-key="rowKey" :current-row-key="currentRowKey" :row-class-name="rowClassName"
v-loading="tableDataLoading" @row-click="rowClick" @row-dblclick="rowDblClick" @selection-change="selectionChange"
@select="tableCheckboxSelectChange" @select-all="tableCheckboxAllSelectChange"
style="width: 100%; display: inline-block" :style="{ 'min-height': props.tableInfo.minHeight ?? '200px' }"
tooltip-effect="light" :tooltip-options="{ placement: 'top', popperClass: 'table_cell_tooltip' }"
:show-summary="props.tableInfo.showSummary ?? false">
<el-table-column type="selection" :width="32" align="center" v-if="multiple" :selectable="rowSelectable"
:fixed="fixedSelection" />
<el-table-column v-for="item in tableFields" :label="item.label" :width="item.width" :min-width="item.minWidth"
:fixed="item.fixed" :align="item.align" :type="item.type == 'index' ? '' : undefined"
:sortable="item.sortable ?? false" :prop="item.field" :class-name="item.columClass"
:show-overflow-tooltip="item.type != 'switch'">
<template #header>
<template v-if="!!item?.toolTipContent">
<span style="color:#000;display: inline-block">{{ item.label }}</span>
<el-tooltip
effect="light"
:content="item.toolTipContent"
placement="top"
>
<el-icon style="color:#b2b2b2;">
<QuestionFilled />
</el-icon>
<el-tooltip effect="light" :content="item.toolTipContent" placement="top">
<el-icon style="color:#b2b2b2;">
<QuestionFilled />
</el-icon>
</el-tooltip>
......@@ -293,7 +255,7 @@ onMounted(() => {
<span style="color:#000">{{ item.label }}</span>
<span v-if="item.required === true" style="color:red;margin-left: 2px;">*</span>
</template>
</template>
</template>
<template #default="scope" v-if="item.type == 'index'">
<span v-if="showPage">{{
pageInfo.curr !== undefined
......@@ -303,97 +265,78 @@ onMounted(() => {
<span v-else>{{ props.tableInfo.sortable ? (scope.row.index) : (scope.$index + 1) }}</span>
</template>
<template #default="scope" v-else-if="item.type == 'tag'">
<el-tag v-if="scope.row[item.field] !== undefined" :type="item.tagType?item.tagType(scope):tagType(scope.row, item.field)">{{
item.getName?item.getName(scope):tagMethod(scope.row, item.field)
}}</el-tag>
<span v-else>{{ '--' }}</span>
<el-tag v-if="scope.row[item.field] !== undefined"
:type="item.tagType ? item.tagType(scope) : tagType(scope.row, item.field)">{{
item.getName ? item.getName(scope) : tagMethod(scope.row, item.field)
}}</el-tag>
<span v-else>{{ '--' }}</span>
</template>
<template #default="scope" v-else-if="item.type == 'popover'">
<el-popover
v-if="scope.row[item.field] !== undefined && (item.checkName?item.checkName(scope):true)"
placement="left-start"
:title="props.tableInfo.popoverTitle || '变化'"
:width="476"
trigger="hover"
@show="()=>popoverHover(scope,item)"
>
<template #reference>
<span :class="{text_btn:item.checkName?item.checkName(scope):true}">{{ item.getName?item.getName(scope):"详情" }}</span>
</template>
<el-table :data="props.tableInfo.popoverData" v-loading="props.tableInfo.popoverloading"
class="tablePover" :row-class-name="tableRowClassName1" border tooltip-effect="light" :span-method="props.tableInfo?.arraySpanMethod">
<el-table-column v-for="col in item.column" :width="col.width" :property="col.field" :label="col.label" :key="col.field" show-overflow-tooltip >
<template #default="scope">
<el-popover v-if="scope.row[item.field] !== undefined && (item.checkName ? item.checkName(scope) : true)"
placement="left-start" :title="props.tableInfo.popoverTitle || '变化'" :width="476" trigger="hover"
@show="() => popoverHover(scope, item)">
<template #reference>
<span :class="{ text_btn: item.checkName ? item.checkName(scope) : true }">{{
item.getName ? item.getName(scope):"详情" }}</span>
</template>
<el-table :data="props.tableInfo.popoverData" v-loading="props.tableInfo.popoverloading" class="tablePover"
:row-class-name="tableRowClassName1" border tooltip-effect="light"
:span-method="props.tableInfo?.arraySpanMethod">
<el-table-column v-for="col in item.column" :width="col.width" :property="col.field" :label="col.label"
:key="col.field" show-overflow-tooltip>
<template #default="scope">
{{ scope.row[col.field] || '--' }}
</template>
</el-table-column>
</el-table>
</template>
</el-table-column>
</el-table>
</el-popover>
<span v-else>{{item.getName?(item.getName(scope) || '--'):"--"}}</span>
<span v-else>{{ item.getName ? (item.getName(scope) || '--') : "--" }}</span>
</template>
<template #default="scope" v-else-if="item.type == 'filter'">
<span>{{ tagMethod(scope.row, item.field) }}</span>
</template>
<template #default="scope" v-else-if="item.type == 'chnum'">
<span v-if="!!item.isNaN">{{ scope.row[item.field]?changeNum(scope.row[item.field]):"--" }}</span>
<span v-if="!!item.isNaN">{{ scope.row[item.field] ? changeNum(scope.row[item.field]) : "--" }}</span>
<span v-else>{{
scope.row[item.field] != null ?
changeNum(
scope.row[item.field] ? scope.row[item.field] : 0,
item.fixedNum ?? 0
) : '--'
changeNum(
scope.row[item.field] ? scope.row[item.field] : 0,
item.fixedNum ?? 0
) : '--'
}}</span>
<span v-if="item.unit">{{ item.unit }}</span>
</template>
<template #default="scope" v-else-if="item.type == 'switch'">
<el-switch
v-model="scope.row[item.field]"
inline-prompt
:disabled="!item.isDisabled ? false : item.isDisabled(scope)"
:active-value="item.activeValue"
:inactive-value="item.inactiveValue"
:width="item.switchWidth"
:active-text="item.activeText"
:inactive-text="item.inactiveText"
:before-change="() => beforeChange(scope, item)"
@change="(val) => switchChange(val, scope, item.field)"
/>
<el-switch v-model="scope.row[item.field]" inline-prompt
:disabled="!item.isDisabled ? false : item.isDisabled(scope)" :active-value="item.activeValue"
:inactive-value="item.inactiveValue" :width="item.switchWidth" :active-text="item.activeText"
:inactive-text="item.inactiveText" :before-change="() => beforeChange(scope, item)"
@change="(val) => switchChange(val, scope, item.field)" />
</template>
<template #default="scope" v-else-if="item.type == 'menu'">
{{ item.menus[scope.row[item.field]] }}
<!-- {{ scope.row[item.field] }} -->
{{ item.menus[scope.row[item.field]] }}
<!-- {{ scope.row[item.field] }} -->
</template>
<template #default="scope" v-else-if="item.type == 'text_btn'">
<span v-if="scope.row[item.field] != null" :class="item.class + ' text_btn'"
@click="(item.click && !item.disabled && !scope.row.disabled) ? item.click(scope, { label: item.label, value: item.value }): handleClick(scope, { label: item.label, value: item.value })" v-preReClick>{{ item.getName ? item.getName(scope) : scope.row[item.field]
@click="(item.click && !item.disabled && !scope.row.disabled) ? item.click(scope, { label: item.label, value: item.value }) : handleClick(scope, { label: item.label, value: item.value })"
v-preReClick>{{ item.getName ? item.getName(scope) : scope.row[item.field]
}}</span>
<span v-else>--</span>
</template>
<template #default="scope" v-else-if="item.type == 'btn'">
<template v-for="btn in item.btns">
<span
v-if="btn.visible ?? true"
class="text_btn"
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn):handleClick(scope, btn)"
v-preReClick
>{{ btn.label }}</span
>
<span v-if="btn.visible ?? true" class="text_btn"
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn) : handleClick(scope, btn)"
v-preReClick>{{ btn.label }}</span>
</template>
</template>
<template #default="scope" v-else-if="item.type == 'input'">
<el-input
v-model.trim="scope.row[item.field]"
placeholder="请输入"
:maxlength="item.maxlength ?? ''"
></el-input>
<el-input v-model.trim="scope.row[item.field]" placeholder="请输入" :maxlength="item.maxlength ?? ''"></el-input>
</template>
<template #default="scope" v-else-if="item.type == 'tooltip'">
<el-tooltip
:placement="item.placement ?? 'bottom-start'"
effect="light"
popper-class="table_tooltip"
:trigger="item.trigger"
>
<el-tooltip :placement="item.placement ?? 'bottom-start'" effect="light" popper-class="table_tooltip"
:trigger="item.trigger">
<template #content>
<div style="width: 236px; text-align: justify">
<p class="tips_title">不符合规则</p>
......@@ -405,159 +348,85 @@ onMounted(() => {
</el-tooltip>
</template>
<template #default="scope" v-else-if="item.type && item.type == 'edit'">
<template v-if="(props.tableInfo.STATUS == 'edit' || scope.row.STATUS == 'edit') && (item.getVisible ? item.getVisible(scope) : true)">
<el-select
v-if="
editForm[item.field] && editForm[item.field].type == 'select'
"
v-model="scope.row[item.field]"
:placeholder="editForm[item.field].placeholder"
:clearable="editForm[item.field].clearable"
:filterable="editForm[item.field].filterable ?? true"
:disabled="
editForm[item.field].disabled && scope.row.guid !== undefined
"
@change="(val) => selectChange(val, scope, item)"
>
<template
v-if="(props.tableInfo.STATUS == 'edit' || scope.row.STATUS == 'edit') && (item.getVisible ? item.getVisible(scope) : true)">
<el-select v-if="
editForm[item.field] && editForm[item.field].type == 'select'
" v-model="scope.row[item.field]" :placeholder="editForm[item.field].placeholder"
:clearable="editForm[item.field].clearable" :filterable="editForm[item.field].filterable ?? true"
:disabled="editForm[item.field].disabled && scope.row.guid !== undefined
" @change="(val) => selectChange(val, scope, item)">
<el-option v-if="props.tableInfo.readonly" label="--" value="" />
<el-option
v-for="opt in editForm[item.field].getOptions ? editForm[item.field].getOptions(scope) : editForm[item.field].options"
:label="editForm[item.field]?.props?.label ? opt[editForm[item.field].props.label] : opt.label"
:value="editForm[item.field]?.props?.value ? opt[editForm[item.field].props.value] : opt.value"
:key="editForm[item.field]?.props?.value ? opt[editForm[item.field].props.value] : opt.value"
/>
:key="editForm[item.field]?.props?.value ? opt[editForm[item.field].props.value] : opt.value" />
</el-select>
<el-input
v-else-if="
editForm[item.field] && editForm[item.field].type == 'input'
"
v-model.trim="scope.row[item.field]"
:placeholder="editForm[item.field].placeholder"
:clearable="editForm[item.field].clearable"
:maxlength="editForm[item.field].maxlength ?? ''"
:disabled="
editForm[item.field].disabled && scope.row.guid !== undefined
"
@input="inputKeyUp(editForm[item.field].regexp, scope, editForm[item.field])"
<el-input v-else-if="
editForm[item.field] && editForm[item.field].type == 'input'
" v-model.trim="scope.row[item.field]" :placeholder="editForm[item.field].placeholder"
:clearable="editForm[item.field].clearable" :maxlength="editForm[item.field].maxlength ?? ''" :disabled="editForm[item.field].disabled && scope.row.guid !== undefined
" @input="inputKeyUp(editForm[item.field].regexp, scope, editForm[item.field])"
@change="(val) => inputChange(val, scope, item)"
@focus="(event) => inputFocus(event, scope, editForm[item.field])"
></el-input>
@focus="(event) => inputFocus(event, scope, editForm[item.field])"></el-input>
<template v-else-if="editForm[item.field] && editForm[item.field].type == 'defaultValue'">
<el-date-picker v-if="scope.row[item.dataTypeName] === 'date'" v-model="scope.row[item.field]" type="date"
format="YYYY-MM-DD" value-format="YYYY-MM-DD" :placeholder="editForm[item.field].placeholder" />
<el-date-picker v-else-if="scope.row[item.dataTypeName] === 'datetime'"
v-model="scope.row[item.field]" :placeholder="editForm[item.field].placeholder" type="datetime" format="YYYY-MM-DD HH:mm:ss"
<el-date-picker v-else-if="scope.row[item.dataTypeName] === 'datetime'" v-model="scope.row[item.field]"
:placeholder="editForm[item.field].placeholder" type="datetime" format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss" />
<el-input v-else v-model.trim="scope.row[item.field]" :placeholder="editForm[item.field].placeholder" :clearable="editForm[item.field].clearable"
:maxlength="editForm[item.field].maxlength ?? ''"
@input="inputKeyUp(scope.row[item.dataTypeName] == 'int' ? /\D/g : (scope.row[item.dataTypeName] == 'decimal' ? /[^0-9.-]/g : ''), scope, editForm[item.field])"
@change="(val) => inputChange(val, scope, item)" />
<el-input v-else v-model.trim="scope.row[item.field]" :placeholder="editForm[item.field].placeholder"
:clearable="editForm[item.field].clearable" :maxlength="editForm[item.field].maxlength ?? ''"
@input="inputKeyUp(scope.row[item.dataTypeName] == 'int' ? /\D/g : (scope.row[item.dataTypeName] == 'decimal' ? /[^0-9.-]/g : ''), scope, editForm[item.field])"
@change="(val) => inputChange(val, scope, item)" />
</template>
<template
v-else-if="
editForm[item.field] && editForm[item.field].type == 'btn'
"
>
<template v-else-if="
editForm[item.field] && editForm[item.field].type == 'btn'
">
<template v-for="btn in scope.row[item.field].btns">
<span
v-if="btn.visible ?? true"
class="text_btn"
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn):handleClick(scope, btn)"
v-preReClick
>{{ btn.label }}</span
>
<span v-if="btn.visible ?? true" class="text_btn"
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn) : handleClick(scope, btn)"
v-preReClick>{{ btn.label }}</span>
</template>
</template>
<template
v-else-if="
editForm[item.field] && editForm[item.field].type == 'comb'
"
>
<template v-else-if="
editForm[item.field] && editForm[item.field].type == 'comb'
">
<div v-if="scope.row['ruleType'] == 'Serial'" class="input_comb">
<span>
<span>起始值</span>
<el-input
v-model.trim="scope.row.start"
style="width: 40px"
></el-input>
<el-input v-model.trim="scope.row.start" style="width: 40px"></el-input>
</span>
<span>
<span>最大值</span>
<el-input
v-model.trim="scope.row.max"
style="width: 100px"
></el-input>
<el-input v-model.trim="scope.row.max" style="width: 100px"></el-input>
</span>
<span>
<span>长度</span>
<el-input
v-model.trim="scope.row.len"
style="width: 40px"
></el-input>
<el-input v-model.trim="scope.row.len" style="width: 40px"></el-input>
</span>
<span>
<span>步长</span>
<el-input
v-model.trim="scope.row.step"
style="width: 40px"
></el-input>
<el-input v-model.trim="scope.row.step" style="width: 40px"></el-input>
</span>
</div>
<el-input
v-else-if="scope.row['ruleType'] == 'Fixed'"
v-model.trim="scope.row.fixedValue"
clearable
></el-input>
<el-select
v-else-if="scope.row['ruleType'] == 'Separator'"
v-model="scope.row.separator"
clearable
>
<el-option
v-if="props.tableInfo.readonly"
label="--"
value=""
/>
<el-option
v-for="opt in editForm[item.field].codeRule.Separator.options"
:key="opt.value"
:label="opt.label"
:value="opt.value"
/>
<el-input v-else-if="scope.row['ruleType'] == 'Fixed'" v-model.trim="scope.row.fixedValue"
clearable></el-input>
<el-select v-else-if="scope.row['ruleType'] == 'Separator'" v-model="scope.row.separator" clearable>
<el-option v-if="props.tableInfo.readonly" label="--" value="" />
<el-option v-for="opt in editForm[item.field].codeRule.Separator.options" :key="opt.value"
:label="opt.label" :value="opt.value" />
</el-select>
<el-select
v-else-if="scope.row['ruleType'] == 'Date'"
v-model="scope.row.format"
clearable
>
<el-option
v-if="props.tableInfo.readonly"
label="--"
value=""
/>
<el-option
v-for="opt in editForm[item.field].codeRule.Date.options"
:key="opt.value"
:label="opt.label"
:value="opt.value"
/>
<el-select v-else-if="scope.row['ruleType'] == 'Date'" v-model="scope.row.format" clearable>
<el-option v-if="props.tableInfo.readonly" label="--" value="" />
<el-option v-for="opt in editForm[item.field].codeRule.Date.options" :key="opt.value" :label="opt.label"
:value="opt.value" />
</el-select>
<el-select
v-else-if="scope.row['ruleType'] == 'Guid'"
v-model="scope.row.mode"
clearable
>
<el-option
v-if="props.tableInfo.readonly"
label="--"
value=""
/>
<el-option
v-for="opt in editForm[item.field].codeRule.Guid.options"
:key="opt.value"
:label="opt.label"
:value="opt.value"
/>
<el-select v-else-if="scope.row['ruleType'] == 'Guid'" v-model="scope.row.mode" clearable>
<el-option v-if="props.tableInfo.readonly" label="--" value="" />
<el-option v-for="opt in editForm[item.field].codeRule.Guid.options" :key="opt.value" :label="opt.label"
:value="opt.value" />
</el-select>
<span v-else>{{ scope.row[item.field] ?? "--" }}</span>
</template>
......@@ -568,41 +437,32 @@ onMounted(() => {
<template #default="scope" v-else>
<template v-if="item.getSvg">
<el-icon class="svg-title-icon" :class="item.getSvg(scope)">
<svg-icon :name="item.getSvg(scope)" />
</el-icon>
<span :style="{'margin-left': '5px'}">{{
item.getName
? item.getName(scope)
: scope.row[item.field] !== 0 && !scope.row[item.field]
? "--"
: scope.row[item.field]
}}</span>
<svg-icon :name="item.getSvg(scope)" />
</el-icon>
<span :style="{ 'margin-left': '5px' }">{{
item.getName
? item.getName(scope)
: scope.row[item.field] !== 0 && !scope.row[item.field]
? "--"
: scope.row[item.field]
}}</span>
</template>
<!--- 直接用??会导致空字符串时无法显示'--'，此处需要区分0和“” -->
<span v-else>{{
item.getName
? item.getName(scope)
: scope.row[item.field] !== 0 && !scope.row[item.field]
? "--"
: scope.row[item.field]
? "--"
: scope.row[item.field]
}}</span>
</template>
</el-table-column>
<el-table-column
:width="actionInfo.width"
:class-name="actionInfo.columClass"
fixed="right"
v-if="actionInfo.show ?? true"
>
<el-table-column :width="actionInfo.width" :class-name="actionInfo.columClass" fixed="right"
v-if="actionInfo.show ?? true">
<template #header>
<div class="header_title">
<span>{{ actionInfo.label ?? "操作" }}</span>
<el-tooltip
placement="top"
effect="light"
popper-class="table_tooltip"
v-if="actionInfo.tooltip"
>
<el-tooltip placement="top" effect="light" popper-class="table_tooltip" v-if="actionInfo.tooltip">
<template #content>
<div style="width: 236px; text-align: justify">
帮助：初始化为系统底层操作，为会员创建数据库及系统表操作，一旦初始化将不可以删除会员。
......@@ -618,169 +478,95 @@ onMounted(() => {
<!-- 某些操作按钮需要根据当前行信息设置显示隐藏，actionInfo.btns使用回调函数返回。 -->
<template v-if="actionInfo.isMore">
<template v-if="Array.isArray(actionInfo.btns)
? actionInfo.btns.length>4
: actionInfo.btns(scope).length>4">
<template
v-for="(btn, b) in Array.isArray(actionInfo.btns)
? actionInfo.btns.slice(0,4)
: actionInfo.btns(scope).slice(0,4)"
>
<span
class="operate_btn"
:class="{ active: btn.visible ?? true }"
v-if="btn.visible ?? true"
>
<BtnPopover
v-if="btn.value == 'authority'"
:popover-info="{ scope, btn, ...popverData }"
@showPopver="handleClick"
@popverBtnClick="handleClick"
/>
<span
class="text_btn"
:class="{ 'is-disabled': !!btn.disabled }"
v-else
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn):handleClick(scope, btn)"
v-preReClick
>{{ btn.label }}</span>
</span>
</template>
<span class="operate_btn active">
<el-dropdown trigger="hover" :show-timeout="50" >
<span class="text_btn">...</span>
<template #dropdown>
<el-dropdown-menu >
<el-dropdown-item v-for="(btn, b) in Array.isArray(actionInfo.btns)
? actionInfo.btns.slice(4)
: actionInfo.btns(scope).slice(4)">
<span
class="operate_btn"
style="width: 100%; display: inline-block;"
:class="{ active: btn.visible ?? true }"
v-if="btn.visible ?? true"
>
<BtnPopover
v-if="btn.value == 'authority'"
:popover-info="{ scope, btn, ...popverData }"
@showPopver="handleClick"
@popverBtnClick="handleClick"
/>
<span
class="text_btn"
style="width: 100%;display: block;"
:class="{ 'is-disabled': !!btn.disabled }"
v-else
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn) : handleClick(scope, btn)"
v-preReClick
>{{ btn.label }}</span
>
? actionInfo.btns.length > 4
: actionInfo.btns(scope).length > 4">
<template v-for="(btn, b) in Array.isArray(actionInfo.btns)
? actionInfo.btns.slice(0, 4)
: actionInfo.btns(scope).slice(0, 4)">
<span class="operate_btn" :class="{ active: btn.visible ?? true }" v-if="btn.visible ?? true">
<BtnPopover v-if="btn.value == 'authority'" :popover-info="{ scope, btn, ...popverData }"
@showPopver="handleClick" @popverBtnClick="handleClick" />
<span class="text_btn" :class="{ 'is-disabled': !!btn.disabled }" v-else
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn) : handleClick(scope, btn)"
v-preReClick>{{ btn.label }}</span>
</span>
</template>
<span class="operate_btn active">
<el-dropdown trigger="hover" :show-timeout="50">
<span class="text_btn">...</span>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item v-for="(btn, b) in Array.isArray(actionInfo.btns)
? actionInfo.btns.slice(4)
: actionInfo.btns(scope).slice(4)">
<span class="operate_btn" style="width: 100%; display: inline-block;"
:class="{ active: btn.visible ?? true }" v-if="btn.visible ?? true">
<BtnPopover v-if="btn.value == 'authority'" :popover-info="{ scope, btn, ...popverData }"
@showPopver="handleClick" @popverBtnClick="handleClick" />
<span class="text_btn" style="width: 100%;display: block;"
:class="{ 'is-disabled': !!btn.disabled }" v-else
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn) : handleClick(scope, btn)"
v-preReClick>{{ btn.label }}</span>
</span>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</span>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</span>
</template>
<template v-else>
<template
v-for="(btn, b) in Array.isArray(actionInfo.btns)
? actionInfo.btns
: actionInfo.btns(scope)"
>
<span
class="operate_btn"
:class="{ active: btn.visible ?? true }"
v-if="btn.visible ?? true"
>
<BtnPopover
v-if="btn.value == 'authority'"
:popover-info="{ scope, btn, ...popverData }"
@showPopver="handleClick"
@popverBtnClick="handleClick"
/>
<span
class="text_btn"
:class="{ 'is-disabled': !!btn.disabled }"
v-else
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn) : handleClick(scope, btn)"
v-preReClick
>{{ btn.label }}</span>
</span>
</template>
</template>
<template v-else>
<template v-for="(btn, b) in Array.isArray(actionInfo.btns)
? actionInfo.btns
: actionInfo.btns(scope)">
<span class="operate_btn" :class="{ active: btn.visible ?? true }" v-if="btn.visible ?? true">
<BtnPopover v-if="btn.value == 'authority'" :popover-info="{ scope, btn, ...popverData }"
@showPopver="handleClick" @popverBtnClick="handleClick" />
<span class="text_btn" :class="{ 'is-disabled': !!btn.disabled }" v-else
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn) : handleClick(scope, btn)"
v-preReClick>{{ btn.label }}</span>
</span>
</template>
</template>
</template>
<template v-else>
<template
v-for="(btn, b) in Array.isArray(actionInfo.btns)
<template v-for="(btn, b) in Array.isArray(actionInfo.btns)
? actionInfo.btns
: actionInfo.btns(scope)"
>
<span
class="operate_btn"
:class="{ active: btn.visible ?? true, 'sort-icon': btn.value == 'sort' }"
v-if="btn.visible ?? true"
>
<el-icon v-if="btn.value == 'sort'" style="width: 24px;height: 15px;vertical-align: text-top;">
<svg-icon style="width: 24px;height: 15px;" name="sort-drag" />
</el-icon>
<BtnPopover
v-if="btn.value == 'authority'"
:popover-info="{ scope, btn, ...popverData }"
@showPopver="handleClick"
@popverBtnClick="handleClick"
/>
<span
class="text_btn"
:class="{ 'is-disabled': !!btn.disabled }"
v-else
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn):handleClick(scope, btn)"
v-preReClick
>{{ btn.label }}</span>
</span>
</template>
: actionInfo.btns(scope)">
<span class="operate_btn" :class="{ active: btn.visible ?? true, 'sort-icon': btn.value == 'sort' }"
v-if="btn.visible ?? true">
<el-icon v-if="btn.value == 'sort'" style="width: 24px;height: 15px;vertical-align: text-top;">
<svg-icon style="width: 24px;height: 15px;" name="sort-drag" />
</el-icon>
<BtnPopover v-if="btn.value == 'authority'" :popover-info="{ scope, btn, ...popverData }"
@showPopver="handleClick" @popverBtnClick="handleClick" />
<span class="text_btn" :class="{ 'is-disabled': !!btn.disabled }" v-else
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn) : handleClick(scope, btn)"
v-preReClick>{{ btn.label }}</span>
</span>
</template>
</template>
<template
v-if="
props.tableInfo.id.indexOf('maintenance') > -1 &&
scope.row.isInit == 'N'
"
>
<span
class="text_btn"
@click="handleClick(scope, { label: '初始化', value: 'init' })"
v-preReClick
>初始化</span
>
<template v-if="
props.tableInfo.id.indexOf('maintenance') > -1 &&
scope.row.isInit == 'N'
">
<span class="text_btn" @click="handleClick(scope, { label: '初始化', value: 'init' })" v-preReClick>初始化</span>
</template>
<template
v-else-if="
props.tableInfo.id.indexOf('product-menu') > -1 &&
scope.row.menuType != 'F'
"
>
<span
class="text_btn"
@click="
handleClick(scope, { label: '添加子菜单', value: 'menu' })
"
v-preReClick
>添加子菜单</span
>
<template v-else-if="
props.tableInfo.id.indexOf('product-menu') > -1 &&
scope.row.menuType != 'F'
">
<span class="text_btn" @click="
handleClick(scope, { label: '添加子菜单', value: 'menu' })
" v-preReClick>添加子菜单</span>
</template>
</template>
</el-table-column>
<template #append>
<td :class="props.tableInfo.footerClass" v-if="props.tableInfo.footerHtml" :colspan="5" v-html="props.tableInfo.footerHtml"></td>
</template>
<td :class="props.tableInfo.footerClass" v-if="props.tableInfo.footerHtml" :colspan="5"
v-html="props.tableInfo.footerHtml"></td>
</template>
</el-table>
<PageNav
v-if="showPage"
:class="[pageInfo.type, pageInfo.col]"
:pageInfo="pageInfo"
@pageChange="pageChange"
/>
<PageNav v-if="showPage" :class="[pageInfo.type, pageInfo.col]" :pageInfo="pageInfo" @pageChange="pageChange" />
</div>
</template>
......@@ -810,17 +596,18 @@ onMounted(() => {
}
}
}
.input_comb {
> span:not(:last-child) {
>span:not(:last-child) {
margin-right: 12px;
> span {
>span {
margin-right: 4px;
}
}
> span:last-child {
> span {
>span:last-child {
>span {
margin-right: 4px;
}
}
......@@ -834,7 +621,7 @@ onMounted(() => {
padding-right: 4px;
position: relative;
& ~ .active {
&~.active {
padding-left: 4px;
margin-left: 1px;
......@@ -855,13 +642,14 @@ onMounted(() => {
}
}
}
.primary {
.el-table__cell {
background: none;
.primary {
.el-table__cell {
background: none;
}
}
}
}
.svg-title-icon {
width: 16px;
......@@ -875,6 +663,7 @@ onMounted(() => {
&.icon-audit {
color: #b2b2b2
}
svg {
width: 100%;
height: 100%;
......@@ -883,14 +672,13 @@ onMounted(() => {
.last-row {
display: flex;
height: 36px;
line-height: 36px;
background: #FFF1D4;
border-bottom: 1px solid #d9d9d9;
border-right: 1px solid #d9d9d9;
flex-direction: row;
justify-content: space-between;
padding: 0px 8px;
height: 36px;
line-height: 36px;
background: #FFF1D4;
border-bottom: 1px solid #d9d9d9;
border-right: 1px solid #d9d9d9;
flex-direction: row;
justify-content: space-between;
padding: 0px 8px;
}
</style>
......
src/views/data_inventory/taskDetail.vue
......@@ -645,7 +645,7 @@ const templateInfo = ref({
],
})
const tabsInfo = ref({
activeName: 'sheet',
activeName: 'field',
tabs: [
{ label: '库表', name: 'sheet' },
{ label: '字段', name: 'field' },
......@@ -854,7 +854,28 @@ const fieldTableInfo = ref({
...page.value,
},
actionInfo: {
show: false
label: "操作",
type: "btn",
width: 80,
btns: (scope) => {
let row = scope.row, btnArr: any = [
{ label: "编辑", value: "edit" },
];
// if (row.approveState == 'Y') {
// if (row.listingStatus == 'Y') {
// btnArr.splice(0, 0, { label: "详情", value: "detail" });
// } else {
// btnArr.splice(0, 0, { label: "编辑", value: "edit" }, { label: "详情", value: "detail" }, { label: "删除", value: "delete" });
// }
// } else {
// if (row.approveState == 'A') {
// btnArr.splice(0, 0, { label: "详情", value: "detail" });
// } else {
// btnArr.splice(0, 0, { label: "编辑", value: "edit" }, { label: "详情", value: "detail" }, { label: "删除", value: "delete" });
// }
// }
return btnArr;
},
},
})
......@@ -1096,7 +1117,7 @@ onBeforeMount(() => {
<div v-else-if="item.type == 'tag'">
<el-tag :type="item.tagType ? item.tagType(scope) : tagType(scope.row, item.field)">{{
item.getName ? item.getName(scope) : tagMethod(scope.row, item.field)
}}</el-tag>
}}</el-tag>
</div>
<span v-else>
{{ item.getName ? item.getName(scope) : scope.row[item.field] !== 0 && !scope.row[item.field]
......@@ -1105,6 +1126,20 @@ onBeforeMount(() => {
</span>
</template>
</el-table-column>
<el-table-column label="操作" :width="fieldTableInfo.actionInfo.width"
:class-name="fieldTableInfo.actionInfo.columClass" fixed="right">
<template #default="scope">
<template v-for="(btn, b) in Array.isArray(fieldTableInfo.actionInfo.btns)
? fieldTableInfo.actionInfo.btns
: fieldTableInfo.actionInfo.btns(scope)">
<span class="operate_btn" :class="{ active: btn.visible ?? true }" v-if="btn.visible ?? true">
<span class="text_btn" :class="{ 'is-disabled': !!btn.disabled }"
@click="(btn.click && !btn.disabled && !scope.row.disabled) ? btn.click(scope, btn) : tableBtnClick(scope, btn)"
v-preReClick>{{ btn.label }}</span>
</span>
</template>
</template>
</el-table-column>
</el-table>
<PageNav :class="[fieldTableInfo.page.type, fieldTableInfo.page.col]" :pageInfo="fieldTableInfo.page"
@pageChange="tablePageChange" />
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!