| | |
| | | <!-- |
| | | * @Date: 2024-04-07 20:43:26 |
| | | * @LastEditors: gaoshp |
| | | * @LastEditTime: 2024-04-08 15:02:14 |
| | | * @FilePath: /cps-web/src/views/master/time/day-off/index.vue |
| | | * @LastEditors: Sneed |
| | | * @LastEditTime: 2024-04-13 22:13:40 |
| | | * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/master/time/day-off/index.vue |
| | | --> |
| | | <template> |
| | | <el-container> |
| | | <el-header> |
| | | <el-button :disabled="selections.length == 0" @click="dels"> |
| | | 删除 |
| | | </el-button> |
| | | <el-button @click="table_add"> |
| | | 创建 |
| | | </el-button> |
| | | <el-select style="width: 200px;margin-left: auto;" v-model="year" @change="query"> |
| | | <el-option v-for="(item, index) in years" :key="index" :label="item" :value="item"></el-option> |
| | | </el-select> |
| | | <el-date-picker @change="query" style="width: 300px;flex: 0 0 auto;margin-left: 8px;" v-model="date" type="daterange" |
| | | range-separator="至" start-placeholder="开始" end-placeholder="结束" value-format="YYYY-MM-DD"/> |
| | | </el-header> |
| | | <el-main> |
| | | <scTable highlight-current-row ref="table" :params="{}" |
| | | :apiObj="apiObj" @selection-change="selectionChange" stripe> |
| | | <el-table-column type="selection" width="50"></el-table-column> |
| | | <el-table-column label="所属年份" prop="year"></el-table-column> |
| | | <el-table-column label="日期" prop="startOffDay"> |
| | | <template #default="scope"> |
| | | <span>{{ scope.row.startOffDay }}-{{ scope.row.endOffDay }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="休息日说明" prop="remark"></el-table-column> |
| | | <el-table-column label="操作" fixed="right" align="right" width="160"> |
| | | <template #default="scope"> |
| | | <el-button-group> |
| | | <el-button text type="primary" size="small" |
| | | @click="table_edit(scope.row, scope.$index)">编辑</el-button> |
| | | <el-popconfirm title="确定删除吗?" @confirm="table_del(scope.row, scope.$index, '0')"> |
| | | <template #reference> |
| | | <el-button text type="primary" size="small">删除</el-button> |
| | | </template> |
| | | </el-popconfirm> |
| | | </el-button-group> |
| | | </template> |
| | | </el-table-column> |
| | | </scTable> |
| | | </el-main> |
| | | <Dialog @success="success" ref="dialog" :option="{ |
| | | years |
| | | }"></Dialog> |
| | | </el-container> |
| | | <el-main> |
| | | <el-card shadow="never"> |
| | | <el-container> |
| | | <el-header> |
| | | <el-button :disabled="selections.length == 0" @click="dels"> |
| | | 删除 |
| | | </el-button> |
| | | <el-button @click="table_add"> |
| | | 创建 |
| | | </el-button> |
| | | <el-select style="width: 200px;margin-left: auto;" v-model="year" @change="query"> |
| | | <el-option v-for="(item, index) in years" :key="index" :label="item" :value="item"></el-option> |
| | | </el-select> |
| | | <el-date-picker @change="query" style="width: 300px;flex: 0 0 auto;margin-left: 8px;" |
| | | v-model="date" type="daterange" range-separator="至" start-placeholder="开始" end-placeholder="结束" |
| | | value-format="YYYY-MM-DD" /> |
| | | </el-header> |
| | | <el-main> |
| | | <scTable highlight-current-row ref="table" :params="{}" :apiObj="apiObj" |
| | | @selection-change="selectionChange" stripe> |
| | | <el-table-column type="selection" width="50"></el-table-column> |
| | | <el-table-column label="所属年份" prop="year"></el-table-column> |
| | | <el-table-column label="日期" prop="startOffDay"> |
| | | <template #default="scope"> |
| | | <span>{{ scope.row.startOffDay }}-{{ scope.row.endOffDay }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="休息日说明" prop="remark"></el-table-column> |
| | | <el-table-column label="操作" fixed="right" align="right" width="160"> |
| | | <template #default="scope"> |
| | | <el-button-group> |
| | | <el-button text type="primary" size="small" |
| | | @click="table_edit(scope.row, scope.$index)">编辑</el-button> |
| | | <el-popconfirm title="确定删除吗?" @confirm="table_del(scope.row, scope.$index, '0')"> |
| | | <template #reference> |
| | | <el-button text type="primary" size="small">删除</el-button> |
| | | </template> |
| | | </el-popconfirm> |
| | | </el-button-group> |
| | | </template> |
| | | </el-table-column> |
| | | </scTable> |
| | | </el-main> |
| | | <Dialog @success="success" ref="dialog" :option="{ |
| | | years |
| | | }"></Dialog> |
| | | </el-container> |
| | | </el-card> |
| | | </el-main> |
| | | </template> |
| | | |
| | | <script> |
| | | import Dialog from './Dialog.vue' |
| | | import Dialog from './Dialog.vue' |
| | | export default { |
| | | components: { |
| | | Dialog |
| | |
| | | return { |
| | | year: '', |
| | | date: '', |
| | | apiObj: '', |
| | | apiObj: '', |
| | | selections: [], |
| | | years: [] |
| | | } |
| | |
| | | this.years = years; |
| | | this.apiObj = this.$API.time.getList |
| | | this.year = new Date().getFullYear() |
| | | this.date = [`${this.year}-01-01`,`${this.year}-12-31`] |
| | | this.date = [`${this.year}-01-01`, `${this.year}-12-31`] |
| | | }, |
| | | methods: { |
| | | table_add () { |
| | | table_add() { |
| | | this.$refs.dialog.open() |
| | | }, |
| | | table_edit (row) { |
| | | table_edit(row) { |
| | | this.$refs.dialog.open('edit', row) |
| | | }, |
| | | query () { |
| | | query() { |
| | | this.$refs.table.reload({ |
| | | year: this.year, |
| | | startOffDay: this.date[0] || '', |
| | | endOffDay: this.date[1] || '' |
| | | }) |
| | | }, |
| | | table_del (row) { |
| | | table_del(row) { |
| | | this.$API.time.remove.delete([row.id]).then(res => { |
| | | this.query() |
| | | }) |
| | | }, |
| | | dels () { |
| | | dels() { |
| | | this.$API.time.remove.delete([...this.selections.map(item => item.id)]).then(res => { |
| | | this.query() |
| | | }) |
| | | }, |
| | | selectionChange (selections) { |
| | | selectionChange(selections) { |
| | | this.selections = selections |
| | | }, |
| | | success () { |
| | | success() { |
| | | this.query() |
| | | } |
| | | } |