|
@@ -0,0 +1,330 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div class="search-term">
|
|
|
+ <el-form :inline="true" :model="searchInfo" class="demo-form-inline">
|
|
|
+ <el-form-item>
|
|
|
+ <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
|
|
|
+ <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog">新增任务</el-button>
|
|
|
+ <el-popover v-model:visible="deleteVisible" placement="top" width="160">
|
|
|
+ <p>确定要删除吗?</p>
|
|
|
+ <div style="text-align: right; margin: 0">
|
|
|
+ <el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
|
|
|
+ <el-button size="mini" type="primary" @click="onDelete">确定</el-button>
|
|
|
+ </div>
|
|
|
+ <template #reference>
|
|
|
+ <el-button icon="el-icon-delete" size="mini" type="danger" style="margin-left: 10px;">批量删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-popover>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ ref="multipleTable"
|
|
|
+ border
|
|
|
+ stripe
|
|
|
+ style="width: 100%"
|
|
|
+ tooltip-effect="dark"
|
|
|
+ :data="tableData"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ >
|
|
|
+ <el-table-column type="selection" width="55" />
|
|
|
+ <el-table-column label="日期" width="180">
|
|
|
+ <template #default="scope">{{ formatDate(scope.row.CreatedAt) }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="目标部门" prop="unitIds">
|
|
|
+ <template #default="scope">
|
|
|
+ <span v-for="item in scope.row.unitIds.split('|')">{{ unitMap[item]+"、" }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="标题" prop="title" />
|
|
|
+ <el-table-column label="内容" prop="text" />
|
|
|
+ <el-table-column label="按钮组">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button size="small" type="primary" class="table-button" @click="updateAssignment(scope.row)">任务详情</el-button>
|
|
|
+ <el-upload
|
|
|
+ :action="`${path}/fileUploadAndDownload/upload`"
|
|
|
+ :show-file-list="false"
|
|
|
+ :multiple="false"
|
|
|
+ :headers="{ 'x-token': token }"
|
|
|
+ :on-error="uploadError"
|
|
|
+ :on-success="uploadSuccess"
|
|
|
+ :data="{assignmentId:scope.row.ID}"
|
|
|
+ style="display:inline;padding: 0px 5px;"
|
|
|
+ >
|
|
|
+ <!-- :before-upload="checkFile"-->
|
|
|
+
|
|
|
+ <!-- :on-remove="delFile"-->
|
|
|
+ <el-button size="small" type="success" class="table-button">上传文件</el-button>
|
|
|
+ </el-upload>
|
|
|
+ <el-button type="danger" size="small" class="table-button" @click="deleteRow(scope.row)">删除</el-button>
|
|
|
+ <el-button size="small" type="warning" class="table-button" @click="updateAssignment(scope.row)">全部下载</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-pagination
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :current-page="page"
|
|
|
+ :page-size="pageSize"
|
|
|
+ :page-sizes="[10, 30, 50, 100]"
|
|
|
+ :style="{float:'right',padding:'20px'}"
|
|
|
+ :total="total"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ />
|
|
|
+ <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" title="弹窗操作">
|
|
|
+ <el-form :model="formData" label-position="right" label-width="80px">
|
|
|
+ <el-form-item label="目标部门:">
|
|
|
+ <el-select
|
|
|
+ v-model="formData.unitId"
|
|
|
+ filterable
|
|
|
+ clearable
|
|
|
+ multiple
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="id in Object.keys(unitMap)"
|
|
|
+ :key="id"
|
|
|
+ :label="unitMap[id]"
|
|
|
+ :value="id"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="标题:">
|
|
|
+ <el-input v-model="formData.title" clearable placeholder="请输入" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="内容:">
|
|
|
+ <el-input v-model="formData.text" clearable placeholder="请输入" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button @click="closeDialog">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="enterDialog">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <el-dialog v-model="dialogFormVisibleInfo" :before-close="closeDialog">
|
|
|
+ <template #title>
|
|
|
+ 任务详情
|
|
|
+ <div style="text-align: center;font-size: 18px;">
|
|
|
+ {{ formData.title }}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </template>
|
|
|
+ <el-divider />
|
|
|
+ 责任单位
|
|
|
+ <div class="assignText">
|
|
|
+ <span v-for="item in formData.unitIds.split('|')" :key="item">{{ unitMap[item]+" | " }}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-divider />
|
|
|
+ 内容
|
|
|
+ <div class="assignText">
|
|
|
+ {{ formData.text }}
|
|
|
+ </div>
|
|
|
+ <el-divider />
|
|
|
+ <el-card v-if="formData.files.length>0" class="box-card">
|
|
|
+ <el-descriptions title="已上传附件" :column="4">
|
|
|
+ <el-descriptions-item v-for="file in formData.files" :key="file.ID">
|
|
|
+ <el-link :href="file.url" type="primary" target="_blank">{{ file.name.substring(0,file.name.lastIndexOf('.')) }}</el-link>
|
|
|
+ </el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </el-card>
|
|
|
+ <div class="assignText">
|
|
|
+ <span v-if="formData.files.length<1">暂无上传文件</span>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {
|
|
|
+ createAssignment,
|
|
|
+ deleteAssignment,
|
|
|
+ deleteAssignmentByIds,
|
|
|
+ updateAssignment,
|
|
|
+ findAssignment,
|
|
|
+ getAssignmentList
|
|
|
+} from '@/api/assignment' // 此处请自行替换地址
|
|
|
+import infoList from '@/mixins/infoList'
|
|
|
+import { getUnitList } from '@/api/unit'
|
|
|
+import { mapGetters } from 'vuex'
|
|
|
+const path = import.meta.env.VITE_BASE_API
|
|
|
+export default {
|
|
|
+ name: 'Assignment',
|
|
|
+ mixins: [infoList],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ path: path,
|
|
|
+ listApi: getAssignmentList,
|
|
|
+ dialogFormVisible: false,
|
|
|
+ type: '',
|
|
|
+ deleteVisible: false,
|
|
|
+ dialogFormVisibleInfo: false,
|
|
|
+ multipleSelection: [],
|
|
|
+ unitMap: {},
|
|
|
+ formData: {
|
|
|
+ unitIds: '',
|
|
|
+ unitId: [],
|
|
|
+ title: '',
|
|
|
+ files: [],
|
|
|
+ text: '',
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters('user', ['token'])
|
|
|
+ },
|
|
|
+ async created() {
|
|
|
+ await this.getUnitList()
|
|
|
+ await this.getTableData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 条件搜索前端看此方法
|
|
|
+ onSubmit() {
|
|
|
+ this.page = 1
|
|
|
+ this.pageSize = 10
|
|
|
+ this.getTableData()
|
|
|
+ },
|
|
|
+ getUnitList() {
|
|
|
+ const params = {
|
|
|
+ page: 1,
|
|
|
+ pageSize: 99999999,
|
|
|
+ }
|
|
|
+ getUnitList(params).then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ res.data.list.forEach((unit, index) => {
|
|
|
+ this.unitMap[unit.ID.toString()] = unit.unitName
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleSelectionChange(val) {
|
|
|
+ this.multipleSelection = val
|
|
|
+ },
|
|
|
+ deleteRow(row) {
|
|
|
+ this.$confirm('确定要删除吗?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.deleteAssignment(row)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async onDelete() {
|
|
|
+ const ids = []
|
|
|
+ if (this.multipleSelection.length === 0) {
|
|
|
+ this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: '请选择要删除的数据'
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.multipleSelection &&
|
|
|
+ this.multipleSelection.map(item => {
|
|
|
+ ids.push(item.ID)
|
|
|
+ })
|
|
|
+ const res = await deleteAssignmentByIds({ ids })
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '删除成功'
|
|
|
+ })
|
|
|
+ if (this.tableData.length === ids.length && this.page > 1) {
|
|
|
+ this.page--
|
|
|
+ }
|
|
|
+ this.deleteVisible = false
|
|
|
+ this.getTableData()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async updateAssignment(row) {
|
|
|
+ const res = await findAssignment({ ID: row.ID })
|
|
|
+ this.type = 'update'
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.formData = res.data.reassignment
|
|
|
+ this.formData.unitId = this.formData.unitIds.split('|')
|
|
|
+ this.dialogFormVisibleInfo = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ closeDialog() {
|
|
|
+ this.dialogFormVisible = false
|
|
|
+ this.dialogFormVisibleInfo = false
|
|
|
+ this.formData = {
|
|
|
+ unitIds: '',
|
|
|
+ title: '',
|
|
|
+ text: '',
|
|
|
+ files: [],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async deleteAssignment(row) {
|
|
|
+ const res = await deleteAssignment({ ID: row.ID })
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '删除成功'
|
|
|
+ })
|
|
|
+ if (this.tableData.length === 1 && this.page > 1) {
|
|
|
+ this.page--
|
|
|
+ }
|
|
|
+ this.getTableData()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async enterDialog() {
|
|
|
+ let res
|
|
|
+ switch (this.type) {
|
|
|
+ case 'create':
|
|
|
+ this.formData.unitIds = this.formData.unitId.join('|')
|
|
|
+ res = await createAssignment(this.formData)
|
|
|
+ break
|
|
|
+ case 'update':
|
|
|
+ res = await updateAssignment(this.formData)
|
|
|
+ break
|
|
|
+ default:
|
|
|
+ res = await createAssignment(this.formData)
|
|
|
+ break
|
|
|
+ }
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '创建/更改成功'
|
|
|
+ })
|
|
|
+ this.closeDialog()
|
|
|
+ this.getTableData()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ uploadSuccess(res) {
|
|
|
+ this.fullscreenLoading = false
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '上传成功'
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: 'warning',
|
|
|
+ message: res.msg
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ uploadError() {
|
|
|
+ this.$message({
|
|
|
+ type: 'error',
|
|
|
+ message: '上传失败'
|
|
|
+ })
|
|
|
+ this.fullscreenLoading = false
|
|
|
+ },
|
|
|
+ openDialog() {
|
|
|
+ this.type = 'create'
|
|
|
+ this.dialogFormVisible = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.assignText{
|
|
|
+ padding-left: 80px;
|
|
|
+ padding-top: 30px;
|
|
|
+}
|
|
|
+</style>
|