Commit d16cddf4 by wangchunyang

部分样式调整

parent 68107a36
......@@ -5,14 +5,14 @@
<TabPane label="人员分类管理" name="userCategory">
<div class="search-div">
<Row type="flex" :gutter="16">
<Col span="6">
<Col span="12">
<span>分类名称:</span>
<Input v-model="filters.userCategory.catgory_name" placeholder="请输入" style="width: 70%" />
<Input v-model="filters.userCategory.catgory_name" placeholder="请输入" style="width: 30%" />
</Col>
<Col span="12" class="text-right">
<Button type="primary" class="mr10" @click="handleSearch('userCategory')">搜索</Button>
<Button class="mr10" @click="handleReset('userCategory')">重置</Button>
<Button type="success" @click="openAddModal('userCategory')">新增</Button>
<Button type="primary" class="mr10" @click="handleReset('userCategory')">重置</Button>
<Button type="primary" @click="openAddModal('userCategory')">新增</Button>
</Col>
</Row>
</div>
......@@ -51,8 +51,8 @@
</Col>
<Col span="12" class="text-right">
<Button type="primary" class="mr10" @click="handleSearch('leaveType')">搜索</Button>
<Button class="mr10" @click="handleReset('leaveType')">重置</Button>
<Button type="success" @click="openAddModal('leaveType')">新增</Button>
<Button type="primary" class="mr10" @click="handleReset('leaveType')">重置</Button>
<Button type="primary" @click="openAddModal('leaveType')">新增</Button>
</Col>
</Row>
</div>
......@@ -82,16 +82,16 @@
<Row type="flex" :gutter="16">
<Col span="6">
<span>分类名称:</span>
<Input v-model="filters.materialCategory.category_Name" placeholder="请输入" style="width: 70%" />
<Input v-model="filters.materialCategory.category_name" placeholder="请输入" style="width: 70%" />
</Col>
<Col span="6">
<span>分类编码:</span>
<Input v-model="filters.materialCategory.category_Code" placeholder="请输入" style="width: 70%" />
<Input v-model="filters.materialCategory.category_code" placeholder="请输入" style="width: 70%" />
</Col>
<Col span="12" class="text-right">
<Button type="primary" class="mr10" @click="handleSearch('materialCategory')">搜索</Button>
<Button class="mr10" @click="handleReset('materialCategory')">重置</Button>
<Button type="success" @click="openAddModal('materialCategory')">新增</Button>
<Button type="primary" class="mr10" @click="handleReset('materialCategory')">重置</Button>
<Button type="primary" @click="openAddModal('materialCategory')">新增</Button>
</Col>
</Row>
</div>
......@@ -130,13 +130,13 @@
<Col span="6">
<span>分类:</span>
<Select v-model="filters.material.category_id" clearable style="width: 70%">
<Option v-for="cat in materialCategoryOptions" :key="cat.id" :value="cat.id">{{ cat.category_Name }}</Option>
<Option v-for="cat in materialCategoryOptions" :key="cat.id" :value="cat.id">{{ cat.category_name }}</Option>
</Select>
</Col>
<Col span="6" class="text-right">
<Button type="primary" class="mr10" @click="handleSearch('material')">搜索</Button>
<Button class="mr10" @click="handleReset('material')">重置</Button>
<Button type="success" @click="openAddModal('material')">新增</Button>
<Button type="primary" class="mr10" @click="handleReset('material')">重置</Button>
<Button type="primary" class="mr10" @click="openAddModal('material')">新增</Button>
<Button type="primary" class="mr10" v-if="showImport()" @click="importShow = true">导入</Button>
</Col>
</Row>
......@@ -186,6 +186,7 @@
<Col span="10">
<div style="text-align: center;">
<Upload
action="#",
:show-upload-list="false"
:before-upload="handleBeforeUpload"
:format="['xls','xlsx']"
......@@ -261,11 +262,11 @@
<!-- 办公用品分类管理弹窗 -->
<Modal v-model="modals.materialCategory.visible" :title="modals.materialCategory.isEdit ? '修改办公用品分类' : '新增办公用品分类'" width="600" :mask-closable="false">
<Form :label-width="120" :model="modals.materialCategory.form" :rules="modals.materialCategory.rules" ref="materialCategoryForm">
<FormItem label="分类编码" prop="category_Code">
<Input v-model="modals.materialCategory.form.category_Code" placeholder="请输入分类编码" />
<FormItem label="分类编码" prop="category_code">
<Input v-model="modals.materialCategory.form.category_code" placeholder="请输入分类编码" />
</FormItem>
<FormItem label="分类名称" prop="category_Name">
<Input v-model="modals.materialCategory.form.category_Name" placeholder="请输入分类名称" />
<FormItem label="分类名称" prop="category_name">
<Input v-model="modals.materialCategory.form.category_name" placeholder="请输入分类名称" />
</FormItem>
<FormItem label="分类描述" prop="remark">
<Input type="textarea" :rows="3" v-model="modals.materialCategory.form.remark" placeholder="请输入分类描述" />
......@@ -287,7 +288,7 @@
<Col span="12">
<FormItem label="分类" prop="category_id">
<Select v-model="modals.material.form.category_id" placeholder="请选择分类" style="width: 100%">
<Option v-for="cat in materialCategoryOptions" :key="cat.id" :value="cat.id">{{ cat.category_Name }}</Option>
<Option v-for="cat in materialCategoryOptions" :key="cat.id" :value="cat.id">{{ cat.category_name }}</Option>
</Select>
</FormItem>
</Col>
......@@ -423,7 +424,7 @@ export default {
filters: {
userCategory: { catgory_name: '' },
leaveType: { type_name: '', type_code: '' },
materialCategory: { category_Name: '', category_Code: '' },
materialCategory: { category_name: '', category_code: '' },
material: { material_name: '', material_code: '', category_id: '' }
},
tables: {
......@@ -484,14 +485,14 @@ export default {
saving: false,
form: {
id: '',
category_Code: '',
category_Name: '',
category_code: '',
category_name: '',
remark: '',
order_no: 0
},
rules: {
category_Code: [{ required: true, message: '请输入分类编码', trigger: 'blur' }],
category_Name: [{ required: true, message: '请输入分类名称', trigger: 'blur' }]
category_code: [{ required: true, message: '请输入分类编码', trigger: 'blur' }],
category_name: [{ required: true, message: '请输入分类名称', trigger: 'blur' }]
}
},
material: {
......@@ -550,8 +551,8 @@ export default {
],
materialCategoryColumns: [
{ type: 'index', title: '序号', width: 60, align: 'center' },
{ title: '分类编码', key: 'category_Code', align: 'center' },
{ title: '分类名称', key: 'category_Name', align: 'center' },
{ title: '分类编码', key: 'category_code', align: 'center' },
{ title: '分类名称', key: 'category_name', align: 'center' },
{ title: '分类描述', key: 'remark', align: 'center' },
{ title: '排序号', key: 'order_no', align: 'center', width: 100 },
{ title: '操作', slot: 'action', align: 'center', width: 180, fixed: 'right' }
......@@ -636,7 +637,7 @@ export default {
const resetMap = {
userCategory: () => ({ catgory_name: '' }),
leaveType: () => ({ type_name: '', type_code: '' }),
materialCategory: () => ({ category_Name: '', category_Code: '' }),
materialCategory: () => ({ category_name: '', category_code: '' }),
material: () => ({ material_name: '', material_code: '', category_id: '' })
}
this.filters[tab] = resetMap[tab]()
......@@ -688,8 +689,8 @@ export default {
},
materialCategory: {
id: '',
category_Code: '',
category_Name: '',
category_code: '',
category_name: '',
remark: '',
order_no: 0
},
......@@ -816,8 +817,8 @@ export default {
const raw = data.results || []
// 规范化后端字段名,确保 id 字段为小写 id,以便 Select v-model 绑定正常工作
this.materialCategoryOptions = Array.isArray(raw) ? raw.map(it => ({
id: (it.Id || it.id || it.category_Code || '').toString(),
category_Name: (it.category_Name || it.categoryName || it.category_Code || '')
id: (it.Id || it.id || it.category_code || '').toString(),
category_name: (it.category_name || it.categoryName || it.category_code || '')
})) : []
}
})
......@@ -899,6 +900,7 @@ export default {
<style scoped>
.key-dm-wrapper {
padding: 10px;
min-height: 80vh;
}
.search-div {
border: 1px solid #dce1e7;
......
......@@ -55,8 +55,7 @@ export default {
pager: { pageNo: 1, pageSize: 10, totalRecord: 0 },
selectedRows: [],
confirming: false,
categoryOptions: []
,
categoryOptions: [],
columns: [
{ type: 'selection', width: 60 },
{ title: '物料编码', key: 'material_code', align: 'center' },
......@@ -148,5 +147,3 @@ export default {
.mr10 { margin-right: 10px; }
.page_style { margin-top: 12px; text-align: right; }
</style>
<template>
<div class="key-dm-stats-wrapper">
<Tabs v-model="activeTab" @on-click="handleTabChange">
<Tabs v-model="activeTab" @on-click="handleTabChange" class="tabsCls">
<TabPane label="办公用品使用统计" name="usage">
<div class="search-div">
<Row type="flex" :gutter="16" align="middle">
<Col :span="8">
<span>时间段</span>
<DatePicker v-model="usageRange" type="daterange" style="width:70%" />
</Col>
<Col :span="8">
<Col :span="20">
<span>开始</span>
<DatePicker v-model="usageStart" type="date" style="min-width:110px;margin-right:20px" />
<span>结束:</span>
<DatePicker v-model="usageEnd" type="date" style="min-width:110px;margin-right:20px" />
<span>物料:</span>
<Input v-model="usageMaterial" placeholder="物料名称或编码" style="width:70%" />
<Input v-model="usageMaterial" placeholder="物料名称或编码" style="width: 150px" />
</Col>
<Col :span="8" class="text-right">
<Col :span="4" class="text-right">
<Button type="primary" class="mr10" @click="loadUsage">统计</Button>
<Button @click="resetUsage">重置</Button>
</Col>
......@@ -28,9 +28,11 @@
<TabPane label="工作量统计" name="workload">
<div class="search-div">
<Row type="flex" :gutter="16" align="middle">
<Col :span="10">
<span>时间段:</span>
<DatePicker v-model="workRange" type="daterange" style="width:70%" />
<Col :span="18">
<span>开始:</span>
<DatePicker v-model="workStart" type="date" style="min-width:110px;margin-right:20px" />
<span>结束:</span>
<DatePicker v-model="workEnd" type="date" style="min-width:110px;margin-right:20px" />
</Col>
<Col :span="6" class="text-right">
<Button type="primary" class="mr10" @click="loadWorkload">统计</Button>
......@@ -65,9 +67,11 @@ export default {
data () {
return {
activeTab: 'usage',
usageRange: [],
usageStart: new Date(new Date().getFullYear(), new Date().getMonth(), 1),
usageEnd: new Date(),
usageMaterial: '',
workRange: [],
workStart: new Date(new Date().getFullYear(), new Date().getMonth(), 1),
workEnd: new Date(),
tables: { usage: [], workload: [] },
loading: { usage: false, workload: false },
usageColumns: [
......@@ -96,39 +100,39 @@ export default {
},
loadUsage () {
this.loading.usage = true
const params = { start: this.usageRange[0], end: this.usageRange[1], material: this.usageMaterial }
const params = { start: this.usageStart, end: this.usageEnd, material: this.usageMaterial }
getUsageStats({ params }).then(ret => {
if (ret.data && ret.data.errcode === 0) this.tables.usage = ret.data.data || []
else this.$Notice.error({ title: '查询失败', desc: ret.data && ret.data.errmsg })
}).finally(() => { this.loading.usage = false })
},
resetUsage () { this.usageRange = []; this.usageMaterial = ''; this.tables.usage = [] },
resetUsage () { this.usageStart = null; this.usageEnd = null; this.usageMaterial = ''; this.tables.usage = [] },
openUsageDetail (row) {
this.detailModal.columns = [{ key: 'user_name', title: '人员' }, { key: 'quantity', title: '数量' }, { key: 'material_name', title: '物料' }, { key: 'department_name', title: '部门' }]
this.detailModal.visible = true
getUsageDetails({ params: { start: this.usageRange[0], end: this.usageRange[1], material: this.usageMaterial, department: row.department_id } }).then(ret => {
getUsageDetails({ params: { start: this.usageStart, end: this.usageEnd, material: this.usageMaterial, department: row.department_id } }).then(ret => {
if (ret.data && ret.data.errcode === 0) this.detailModal.rows = ret.data.data || []
else this.$Notice.error({ title: '查询失败', desc: ret.data && ret.data.errmsg })
})
},
loadWorkload () {
this.loading.workload = true
const params = { start: this.workRange[0], end: this.workRange[1] }
const params = { start: this.workStart, end: this.workEnd }
getWorkloadStats({ params }).then(ret => {
if (ret.data && ret.data.errcode === 0) this.tables.workload = ret.data.data || []
else this.$Notice.error({ title: '查询失败', desc: ret.data && ret.data.errmsg })
}).finally(() => { this.loading.workload = false })
},
resetWorkload () { this.workRange = []; this.tables.workload = [] },
resetWorkload () { this.workStart = null; this.workEnd = null; this.tables.workload = [] },
openWorkloadDetail (row, type) {
if (type === 'leave') {
this.detailModal.columns = [{ key: 'user_name', title: '人员' }, { key: 'start_time', title: '开始' }, { key: 'end_time', title: '结束' }, { key: 'duration', title: '时长' }]
getWorkloadDetails({ params: { user_id: row.user_id, start: this.workRange[0], end: this.workRange[1], type: 'leave' } }).then(ret => {
getWorkloadDetails({ params: { user_id: row.user_id, start: this.workStart, end: this.workEnd, type: 'leave' } }).then(ret => {
if (ret.data && ret.data.errcode === 0) { this.detailModal.rows = ret.data.data || []; this.detailModal.visible = true } else this.$Notice.error({ title: '查询失败', desc: ret.data && ret.data.errmsg })
})
} else {
this.detailModal.columns = [{ key: 'application_no', title: '申请单号' }, { key: 'material_name', title: '物料' }, { key: 'apply_quantity', title: '数量' }]
getWorkloadDetails({ params: { user_id: row.user_id, start: this.workRange[0], end: this.workRange[1], type: 'inventory' } }).then(ret => {
getWorkloadDetails({ params: { user_id: row.user_id, start: this.workStart, end: this.workEnd, type: 'inventory' } }).then(ret => {
if (ret.data && ret.data.errcode === 0) { this.detailModal.rows = ret.data.data || []; this.detailModal.visible = true } else this.$Notice.error({ title: '查询失败', desc: ret.data && ret.data.errmsg })
})
}
......@@ -138,7 +142,8 @@ export default {
</script>
<style scoped>
.key-dm-stats-wrapper { padding: 10px; }
.key-dm-stats-wrapper { padding: 10px; min-height: 380px;}
.tabsCls { min-height: 380px;}
.search-div { border: 1px solid #dce1e7; padding: 12px; margin-bottom: 12px; background-color: #f8fbff; }
.mr10 { margin-right: 10px; }
.text-right { text-align: right; }
......
<template>
<div class="key-dm-leave-wrapper">
<Tabs v-model="activeTab" @on-click="handleTabChange">
<Tabs v-model="activeTab" @on-click="handleTabChange" class="tabsCls">
<TabPane label="请假申请" name="apply">
<div class="search-div">
<Row type="flex" :gutter="16">
......@@ -62,13 +62,13 @@
<TabPane label="请假统计" name="stats">
<div class="search-div">
<Row type="flex" :gutter="16" align="middle">
<Col span="8">
<span>时间段</span>
<DatePicker v-model="statsRange" type="daterange" placeholder="选择时间段" style="width:70%" />
</Col>
<Col span="8">
<Col span="16">
<span>开始</span>
<DatePicker v-model="statsStart" type="date" placeholder="开始日期" style="min-width:110px;margin-right:20px" />
<span>结束:</span>
<DatePicker v-model="statsEnd" type="date" placeholder="结束日期" style="min-width:110px;margin-right:20px" />
<span>部门:</span>
<Input v-model="statsDept" placeholder="请输入部门名称或ID" style="width:65%" />
<Input v-model="statsDept" placeholder="请输入部门名称或ID" style="width: 150px" />
</Col>
<Col span="8" class="text-right">
<Button type="primary" class="mr10" @click="loadStats">统计</Button>
......@@ -228,7 +228,8 @@ export default {
applyModal: { visible: false, isEdit: false, saving: false, form: {} },
approveModal: { visible: false, record: {}, comment: '', submitting: false },
detailModal: { visible: false, loading: false, data: {}, approvals: [] },
statsRange: [],
statsStart: new Date(new Date().getFullYear(), new Date().getMonth(), 1),
statsEnd: new Date(),
statsDept: ''
}
},
......@@ -346,8 +347,8 @@ export default {
loadStats () {
this.loading.stats = true
const params = {
start: this.statsRange && this.statsRange[0],
end: this.statsRange && this.statsRange[1],
start: this.statsStart,
end: this.statsEnd,
department: this.statsDept
}
getLeaveStats({ params }).then(ret => {
......@@ -359,7 +360,8 @@ export default {
}).finally(() => { this.loading.stats = false })
},
resetStats () {
this.statsRange = []
this.statsStart = null
this.statsEnd = null
this.statsDept = ''
this.tables.stats = []
}
......@@ -368,7 +370,8 @@ export default {
</script>
<style scoped>
.key-dm-leave-wrapper { padding: 10px; }
.key-dm-leave-wrapper { padding: 10px; min-height: 380px;}
.tabsCls { min-height: 380px;}
.search-div { border: 1px solid #dce1e7; padding: 12px; margin-bottom: 12px; background-color: #f8fbff; }
.mr10 { margin-right: 10px; }
.text-right { text-align: right; }
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论