|
@ -34,75 +34,85 @@ |
|
|
</ButtonGradient> |
|
|
</ButtonGradient> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<InputSearch style="width: 402px;" :formList="searchFormList" :formConfigOptions="{ labelWidth: '72px' }" |
|
|
<InputSearch |
|
|
|
|
|
style="width: 402px;" |
|
|
|
|
|
:formList="searchFormList" |
|
|
|
|
|
:formConfigOptions="{ labelWidth: '100px' }" |
|
|
|
|
|
placeholder="请输入姓名、电话,回车搜索" |
|
|
|
|
|
type="input" |
|
|
|
|
|
:params="params" |
|
|
@handleSearch="handleSearch" /> |
|
|
@handleSearch="handleSearch" /> |
|
|
</div> |
|
|
</div> |
|
|
<!-- <ElEmpty v-if="!data.length && !isFirst" description="暂无数据" style="width: 100%;height: 100%;position: absolute;" /> --> |
|
|
|
|
|
<div v-if="!data.length && !isFirst" class="no-data" style="position: absolute">暂无数据</div> |
|
|
|
|
|
|
|
|
|
|
|
<SpecialTable v-else :columns="columns" :data="data" class="body"> |
|
|
<div class="body"> |
|
|
<template #title-DateDuty> |
|
|
<ElEmpty v-if="!data.length && !isFirst" description="暂无数据" style="width: 100%;height: 100%;position: absolute;" /> |
|
|
<div class="special-title"> |
|
|
<!-- <div v-if="!data.length && !isFirst" class="no-data" style="position: absolute">暂无数据</div> --> |
|
|
值班中心 |
|
|
|
|
|
</div> |
|
|
<SpecialTable v-else :columns="columns" :data="data" class="body"> |
|
|
</template> |
|
|
<template #title-DateDuty> |
|
|
<template #content-date="{ data }"> |
|
|
<div class="special-title"> |
|
|
<div class="item"> |
|
|
值班中心 |
|
|
<img src="@screen/images/form/calendar.svg" /> |
|
|
</div> |
|
|
{{ data.date }} |
|
|
</template> |
|
|
</div> |
|
|
<template #content-date="{ data }"> |
|
|
</template> |
|
|
|
|
|
<template #content-organizationName="{ data }"> |
|
|
|
|
|
<div class="parent"> |
|
|
|
|
|
<div class="item"> |
|
|
<div class="item"> |
|
|
<img src="@screen/images/form/location.svg" /> |
|
|
<img src="@screen/images/form/calendar.svg" /> |
|
|
{{ data['organizationName'] }} |
|
|
{{ data.date }} |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
<template #content-organizationName="{ data }"> |
|
|
<template #content-dayShift="{ data }"> |
|
|
<div class="parent"> |
|
|
<div class="item-parent" v-if="data.dayShift && data.dayShift.length"> |
|
|
<div class="item"> |
|
|
<div class="item" v-for="item in data.dayShift"> |
|
|
<img src="@screen/images/form/location.svg" /> |
|
|
<img src="@screen/images/form/people.svg" /> |
|
|
{{ data['organizationName'] }} |
|
|
{{ item.name }} |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
<div class="no-data" v-else> |
|
|
<template #content-dayShift="{ data }"> |
|
|
无值班人员 |
|
|
<div class="item-parent" v-if="data.dayShift && data.dayShift.length"> |
|
|
</div> |
|
|
<div class="item" v-for="(item,index) in data.dayShift" :key="index" > |
|
|
</template> |
|
|
<img src="@screen/images/form/people.svg" /> |
|
|
<template #content-graveyardShift="{ data }"> |
|
|
{{ item.name }} |
|
|
<div class="item-parent" v-if="data.graveyardShift && data.graveyardShift.length"> |
|
|
</div> |
|
|
<div class="item" v-for="item in data.graveyardShift"> |
|
|
|
|
|
<img src="@screen/images/form/people.svg" /> |
|
|
|
|
|
{{ item.name }} |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="no-data" v-else> |
|
|
<div class="no-data" v-else> |
|
|
无值班人员 |
|
|
无值班人员 |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
<template #content-graveyardShift="{ data }"> |
|
|
<template #operation-content="{ data }"> |
|
|
<div class="item-parent" v-if="data.graveyardShift && data.graveyardShift.length"> |
|
|
<ButtonGradient class="operate-button" @click.native="handleModifyDutyInformationTable(true, data)"> |
|
|
<div class="item" v-for="(item,index) in data.graveyardShift" :key="index"> |
|
|
<template #prefix> |
|
|
<img src="@screen/images/form/people.svg" /> |
|
|
<img src="@screen/images/form/edit.svg" /> |
|
|
{{ item.name }} |
|
|
</template> |
|
|
</div> |
|
|
修改 |
|
|
</div> |
|
|
</ButtonGradient> |
|
|
<div class="no-data" v-else> |
|
|
<ButtonGradient class="operate-button" @click.native="handleOperateRecord(true, data)"> |
|
|
无值班人员 |
|
|
<template #prefix> |
|
|
</div> |
|
|
<img src="@screen/images/form/record.svg" /> |
|
|
</template> |
|
|
</template> |
|
|
<template #operation-content="{ data }"> |
|
|
记录 |
|
|
<ButtonGradient class="operate-button" @click.native="handleModifyDutyInformationTable(true, data)"> |
|
|
</ButtonGradient> |
|
|
<template #prefix> |
|
|
<ButtonGradient class="operate-button" @click.native="handleDelete(data)"> |
|
|
<img src="@screen/images/form/edit.svg" /> |
|
|
<template #prefix> |
|
|
</template> |
|
|
<img src="@screen/images/form/delete.svg" /> |
|
|
修改 |
|
|
</template> |
|
|
</ButtonGradient> |
|
|
删除 |
|
|
<ButtonGradient class="operate-button" @click.native="handleOperateRecord(true, data)"> |
|
|
</ButtonGradient> |
|
|
<template #prefix> |
|
|
</template> |
|
|
<img src="@screen/images/form/record.svg" /> |
|
|
</SpecialTable> |
|
|
</template> |
|
|
|
|
|
记录 |
|
|
|
|
|
</ButtonGradient> |
|
|
|
|
|
<ButtonGradient class="operate-button" @click.native="handleDelete(data)"> |
|
|
|
|
|
<template #prefix> |
|
|
|
|
|
<img src="@screen/images/form/delete.svg" /> |
|
|
|
|
|
</template> |
|
|
|
|
|
删除 |
|
|
|
|
|
</ButtonGradient> |
|
|
|
|
|
</template> |
|
|
|
|
|
</SpecialTable> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<OperateRecord :visible="operateRecordVisible" @close="handleOperateRecord(false)" :data="dialogData" /> |
|
|
<OperateRecord :visible="operateRecordVisible" @close="handleOperateRecord(false)" :data="dialogData" /> |
|
|
|
|
|
|
|
@ -123,6 +133,7 @@ import request from "@/utils/request"; |
|
|
import { setLoading } from "@screen/utils/index.js" |
|
|
import { setLoading } from "@screen/utils/index.js" |
|
|
import { delay, exportFile, confirm, uploadFile } from "@screen/utils/common"; |
|
|
import { delay, exportFile, confirm, uploadFile } from "@screen/utils/common"; |
|
|
import { Message } from "element-ui"; |
|
|
import { Message } from "element-ui"; |
|
|
|
|
|
import { getSelectOptionsStation } from "@screen/pages/control/event/businessDataManagement/utils.js"; |
|
|
|
|
|
|
|
|
export default { |
|
|
export default { |
|
|
name: 'DutyOfficer', |
|
|
name: 'DutyOfficer', |
|
@ -163,23 +174,40 @@ export default { |
|
|
{ |
|
|
{ |
|
|
label: "值班日期:", |
|
|
label: "值班日期:", |
|
|
key: "date", |
|
|
key: "date", |
|
|
required: true, |
|
|
required: false, |
|
|
type: "datePicker", |
|
|
type: "datePicker", |
|
|
options: { |
|
|
options: { |
|
|
valueFormat: "yyyy-MM-dd" |
|
|
valueFormat: "yyyy-MM-dd" |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
label: "驻点:", |
|
|
|
|
|
key: "station", |
|
|
|
|
|
type: "select", |
|
|
|
|
|
options: { |
|
|
|
|
|
clearable: true, |
|
|
|
|
|
options: [], |
|
|
|
|
|
}, |
|
|
|
|
|
}, |
|
|
], |
|
|
], |
|
|
operateRecordVisible: false, |
|
|
operateRecordVisible: false, |
|
|
modifyDutyInformationTableVisible: false, |
|
|
modifyDutyInformationTableVisible: false, |
|
|
dialogData: null, |
|
|
dialogData: null, |
|
|
isFirst: true, |
|
|
isFirst: true, |
|
|
|
|
|
params: "name", |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
created() { |
|
|
created() { |
|
|
this.getData(); |
|
|
this.getData(); |
|
|
|
|
|
this.getOptions(); |
|
|
}, |
|
|
}, |
|
|
methods: { |
|
|
methods: { |
|
|
|
|
|
async getOptions() { |
|
|
|
|
|
|
|
|
|
|
|
const result = await getSelectOptionsStation(2); |
|
|
|
|
|
|
|
|
|
|
|
this.searchFormList[1].options.options = result; |
|
|
|
|
|
}, |
|
|
handleOperateRecord(bool, data) { |
|
|
handleOperateRecord(bool, data) { |
|
|
this.operateRecordVisible = bool; |
|
|
this.operateRecordVisible = bool; |
|
|
this.dialogData = data; |
|
|
this.dialogData = data; |
|
|