commit
df2fec3107
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 494 B |
@ -0,0 +1,52 @@
|
|||||||
|
export const asideMap: Recordable<AsideEntity> = {
|
||||||
|
izupuser: {
|
||||||
|
label: '提报人',
|
||||||
|
defaultValue: null,
|
||||||
|
isDefaultFilter: true,
|
||||||
|
key: 'izupuser',
|
||||||
|
component: ReportUserVue,
|
||||||
|
},
|
||||||
|
izproject: {
|
||||||
|
label: '所属项目',
|
||||||
|
defaultValue: null,
|
||||||
|
isDefaultFilter: true,
|
||||||
|
key: 'izproject',
|
||||||
|
component: IzProjectVue,
|
||||||
|
},
|
||||||
|
izplan: {
|
||||||
|
label: '所属计划',
|
||||||
|
defaultValue: null,
|
||||||
|
isDefaultFilter: true,
|
||||||
|
key: 'izplan',
|
||||||
|
component: PlanVue,
|
||||||
|
},
|
||||||
|
izstatus: {
|
||||||
|
label: '审批状态',
|
||||||
|
defaultValue: null,
|
||||||
|
isDefaultFilter: false,
|
||||||
|
key: 'izstatus',
|
||||||
|
component: PlanVue, // todo
|
||||||
|
},
|
||||||
|
izuptime: {
|
||||||
|
label: '提报时间',
|
||||||
|
defaultValue: null,
|
||||||
|
isDefaultFilter: false,
|
||||||
|
key: 'izuptime',
|
||||||
|
component: TimeVue,
|
||||||
|
},
|
||||||
|
iztaskrrom: {
|
||||||
|
label: '任务来源',
|
||||||
|
defaultValue: null,
|
||||||
|
isDefaultFilter: false,
|
||||||
|
key: 'iztaskrrom',
|
||||||
|
component: IztaskrromVue,
|
||||||
|
},
|
||||||
|
izshowall: {
|
||||||
|
label: '显示全部任务数据',
|
||||||
|
defaultValue: true,
|
||||||
|
isDefaultFilter: false,
|
||||||
|
key: 'izshowall',
|
||||||
|
component: PictureDownloadVue,
|
||||||
|
inFilterList: false,
|
||||||
|
},
|
||||||
|
}
|
||||||
@ -0,0 +1,42 @@
|
|||||||
|
import { defineStore } from 'pinia'
|
||||||
|
import { store } from '@/store'
|
||||||
|
import { getFilter } from '@/api/home/filter'
|
||||||
|
|
||||||
|
export interface ConfigState {
|
||||||
|
customConfig: string[] | null
|
||||||
|
asideValue: any
|
||||||
|
}
|
||||||
|
|
||||||
|
export const useFinalStore = defineStore({
|
||||||
|
id: 'app-final',
|
||||||
|
state: (): ConfigState => ({
|
||||||
|
customConfig: null,
|
||||||
|
asideValue: null,
|
||||||
|
}),
|
||||||
|
getters: {
|
||||||
|
getCustomConfig(): string[] | null {
|
||||||
|
return this.customConfig
|
||||||
|
},
|
||||||
|
getAsideValue(): any {
|
||||||
|
return this.asideValue
|
||||||
|
},
|
||||||
|
},
|
||||||
|
actions: {
|
||||||
|
setAsideValue(value) {
|
||||||
|
this.asideValue = value
|
||||||
|
},
|
||||||
|
// 获取终审个性化配置
|
||||||
|
async fetchCustomConfig() {
|
||||||
|
const res = await getFilter(1)
|
||||||
|
const { data } = res
|
||||||
|
const list = data && data.searchcount ? data.searchcount.split(',') : []
|
||||||
|
this.customConfig = list
|
||||||
|
return list
|
||||||
|
},
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
// Need to be used outside the setup
|
||||||
|
export function useFinal() {
|
||||||
|
return useFinalStore(store)
|
||||||
|
}
|
||||||
@ -1,163 +0,0 @@
|
|||||||
<script lang="ts" setup>
|
|
||||||
import { computed, defineOptions, nextTick, onBeforeMount, onMounted, reactive, ref, unref } from 'vue'
|
|
||||||
import CustomFieldModalVue from '../modal/CustomFieldModal.vue'
|
|
||||||
import WorkSheetList from './WorkSheetList.vue'
|
|
||||||
import { useWindowSizeFn } from '@/hooks/event/useWindowSizeFn'
|
|
||||||
import { getViewportOffset } from '@/utils/domUtils'
|
|
||||||
import type { PackageListItem } from '/#/workorder'
|
|
||||||
import { useWorkOrder } from '@/store/modules/workOrder'
|
|
||||||
|
|
||||||
defineOptions({ name: 'AsideContent' })
|
|
||||||
|
|
||||||
const collapse = ref(false)
|
|
||||||
const workStore = useWorkOrder()
|
|
||||||
const filterModalRef = ref(null)
|
|
||||||
|
|
||||||
function collapseHandler() {
|
|
||||||
collapse.value = !collapse.value
|
|
||||||
}
|
|
||||||
|
|
||||||
const asideWidth = computed(() => {
|
|
||||||
return collapse.value ? 0 : 308
|
|
||||||
})
|
|
||||||
|
|
||||||
const asideStyle = computed(() => {
|
|
||||||
return {
|
|
||||||
width: `${asideWidth.value}px`,
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
const collapseIcon = computed(() => {
|
|
||||||
return collapse.value ? 'expand-cir' : 'collapse-cir'
|
|
||||||
})
|
|
||||||
|
|
||||||
const listHeight = ref(700)
|
|
||||||
|
|
||||||
function computeListHeight() {
|
|
||||||
const listEl = document.querySelector('.work-sheet-list')!
|
|
||||||
const { bottomIncludeBody } = getViewportOffset(listEl)
|
|
||||||
const height = bottomIncludeBody
|
|
||||||
listHeight.value = height - 25
|
|
||||||
}
|
|
||||||
|
|
||||||
const listStyle = computed(() => {
|
|
||||||
return {
|
|
||||||
height: `${listHeight.value}px`,
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
useWindowSizeFn(computeListHeight, 280)
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
nextTick(() => {
|
|
||||||
computeListHeight()
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
const data = ref<PackageListItem[]>([])
|
|
||||||
|
|
||||||
const pagination = reactive({
|
|
||||||
pageNo: 1,
|
|
||||||
pageSize: 10,
|
|
||||||
})
|
|
||||||
|
|
||||||
onBeforeMount(async () => {
|
|
||||||
const orderList = await workStore.fetchOrderList(pagination)
|
|
||||||
data.value = orderList
|
|
||||||
})
|
|
||||||
|
|
||||||
const asideEnter = ref(false)
|
|
||||||
|
|
||||||
const showCollapse = computed(() => {
|
|
||||||
return collapse.value ? true : asideEnter.value
|
|
||||||
})
|
|
||||||
|
|
||||||
function showFilter() {
|
|
||||||
const modal = unref(filterModalRef)! as any
|
|
||||||
modal.showModal()
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="aside" :style="asideStyle" @mouseenter="asideEnter = true" @mouseleave="asideEnter = false">
|
|
||||||
111fsfsf发送到发
|
|
||||||
|
|
||||||
<div v-show="showCollapse" class="aside-collapse">
|
|
||||||
<div class="aside-collapse-btn" @click="collapseHandler">
|
|
||||||
<SvgIcon :name="collapseIcon" size="40" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="aside-header">
|
|
||||||
<div class="aside-header-left">
|
|
||||||
<svg-icon name="all-worksheet" size="32" />
|
|
||||||
<span style="margin-left: 8px;">所有工单</span>
|
|
||||||
</div>
|
|
||||||
<div class="aside-header-right">
|
|
||||||
<SvgIcon style="cursor: pointer;margin-left: 10px;" size="18" name="magnifying-1" />
|
|
||||||
<SvgIcon style="cursor: pointer;margin-left: 10px;" size="18" name="filter" @click="showFilter" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<WorkSheetList :style="listStyle" class="work-sheet-list" :data="data" :active-id="workStore.getActiveId" />
|
|
||||||
<CustomFieldModalVue ref="filterModalRef" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.aside {
|
|
||||||
display: flex;
|
|
||||||
position: relative;
|
|
||||||
flex-direction: column;
|
|
||||||
background: #FFF;
|
|
||||||
border: 1px solid rgb(239, 239, 245);
|
|
||||||
border-radius: 3px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
&-header {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
padding: 12px 16px;
|
|
||||||
width: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
&-left {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-right {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-divider {
|
|
||||||
margin-left: 16px;
|
|
||||||
width: 292px;
|
|
||||||
height: 1px;
|
|
||||||
background-color: #e8e8e8;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-collapse {
|
|
||||||
width: 2px;
|
|
||||||
height: 100%;
|
|
||||||
background: #507afd;
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-collapse-btn {
|
|
||||||
position: absolute;
|
|
||||||
cursor: pointer;
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
top: calc(15%);
|
|
||||||
right: -20px;
|
|
||||||
z-index: 10;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
../types
|
|
||||||
@ -1,37 +0,0 @@
|
|||||||
<script lang="ts" setup>
|
|
||||||
import type { PackageListItem } from '/#/workorder'
|
|
||||||
import ListItem from './ListItem.vue'
|
|
||||||
import { useWorkOrder } from '@/store/modules/workOrder'
|
|
||||||
|
|
||||||
defineOptions({ name: 'WorkSheetList' })
|
|
||||||
|
|
||||||
defineProps({
|
|
||||||
activeId: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
data: {
|
|
||||||
type: Object as PropType<PackageListItem[]>,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
const workStore = useWorkOrder()
|
|
||||||
|
|
||||||
function selectHandler(id: string, index: number) {
|
|
||||||
workStore.setActive(index)
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<n-scrollbar>
|
|
||||||
<ListItem
|
|
||||||
v-for="(item, index) in data" :key="item.id" :selected="activeId === item.id" :list-item="item"
|
|
||||||
@click="selectHandler(item.id, index)"
|
|
||||||
/>
|
|
||||||
</n-scrollbar>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
</style>
|
|
||||||
../types
|
|
||||||
@ -1,167 +0,0 @@
|
|||||||
<script lang="ts" setup>
|
|
||||||
import { computed, onBeforeMount, ref } from 'vue'
|
|
||||||
import { useDictionary } from '@/store/modules/dictonary'
|
|
||||||
|
|
||||||
const emit = defineEmits<{
|
|
||||||
(e: 'commit', id: any, desc: null | string)
|
|
||||||
}>()
|
|
||||||
|
|
||||||
const dictonaryStore = useDictionary()
|
|
||||||
|
|
||||||
const show = ref(false)
|
|
||||||
const cardStyle = {
|
|
||||||
'width': '520px',
|
|
||||||
'--n-padding-bottom': '10px',
|
|
||||||
'--n-padding-left': '0px',
|
|
||||||
}
|
|
||||||
|
|
||||||
function showModal() {
|
|
||||||
show.value = true
|
|
||||||
}
|
|
||||||
|
|
||||||
function closeModal() {
|
|
||||||
show.value = false
|
|
||||||
}
|
|
||||||
|
|
||||||
defineExpose({
|
|
||||||
showModal,
|
|
||||||
})
|
|
||||||
|
|
||||||
const options = ref<any[]>([])
|
|
||||||
|
|
||||||
const selectId = ref(null)
|
|
||||||
const otherValue = ref(null)
|
|
||||||
const showOther = computed(() => {
|
|
||||||
for (const item of options.value) {
|
|
||||||
if (item.value === selectId.value && item.label === '其他')
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
|
|
||||||
return false
|
|
||||||
})
|
|
||||||
|
|
||||||
async function handleSumbit(e: MouseEvent) {
|
|
||||||
e.preventDefault()
|
|
||||||
closeModal()
|
|
||||||
emit('commit', selectId.value, otherValue.value)
|
|
||||||
}
|
|
||||||
|
|
||||||
onBeforeMount(async () => {
|
|
||||||
const tfList = await dictonaryStore.fetchTFList()
|
|
||||||
options.value = tfList
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<n-modal v-model:show="show" transform-origin="center">
|
|
||||||
<n-card :style="cardStyle" :bordered="false" size="huge" role="dialog" aria-modal="true">
|
|
||||||
<div class="wrapper">
|
|
||||||
<div class="wrapper-header">
|
|
||||||
<span class="wrapper-left">选择判假原因</span>
|
|
||||||
<div class="wrapper-right">
|
|
||||||
<div class="wrapper-right-close" @pointerdown="closeModal">
|
|
||||||
<div class="wrapper-right-icon" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="wrapper-content">
|
|
||||||
<span>判假原因</span>
|
|
||||||
<n-select v-model:value="selectId" style="margin-top: 10px;" :options="options" />
|
|
||||||
<n-input v-show="showOther" v-model:value="otherValue" style="margin-top: 10px;" type="textarea" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<template #footer>
|
|
||||||
<div class="wrapper-footer">
|
|
||||||
<n-button type="info" @click="handleSumbit">
|
|
||||||
确认
|
|
||||||
</n-button>
|
|
||||||
<n-button secondary style="margin-left:15px" @click="closeModal">
|
|
||||||
取消
|
|
||||||
</n-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</n-card>
|
|
||||||
</n-modal>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.wrapper {
|
|
||||||
&-header {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-left {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-right {
|
|
||||||
&-close {
|
|
||||||
width: 18px;
|
|
||||||
height: 18px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-icon {
|
|
||||||
background: #000;
|
|
||||||
display: inline-block;
|
|
||||||
width: 18px;
|
|
||||||
height: 1px;
|
|
||||||
transform: rotate(45deg);
|
|
||||||
-webkit-transform: rotate(45deg);
|
|
||||||
margin-bottom: 8px;
|
|
||||||
|
|
||||||
&:after {
|
|
||||||
content: '';
|
|
||||||
display: block;
|
|
||||||
width: 18px;
|
|
||||||
height: 1px;
|
|
||||||
background: #000;
|
|
||||||
transform: rotate(-90deg);
|
|
||||||
-webkit-transform: rotate(-90deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-content {
|
|
||||||
padding: 18px 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-footer {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-info {
|
|
||||||
font-weight: bold;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
background-color: #1980ff;
|
|
||||||
content: '';
|
|
||||||
width: 5px;
|
|
||||||
border-radius: 2px;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep(.n-card.n-card--content-segmented > .n-card__content:not(:first-child)) {
|
|
||||||
border: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep(.n-card > .n-card-header) {
|
|
||||||
--n-padding-top: 0px;
|
|
||||||
--n-padding-bottom: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep(.n-divider:not(.n-divider--vertical)) {
|
|
||||||
margin-top: 0px;
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
Reference in new issue