|
|
@@ -0,0 +1,297 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div
|
|
|
+ style="height: 300px"
|
|
|
+ class="bg-white"
|
|
|
+ >
|
|
|
+ <div class="basicInformation">
|
|
|
+ <div style="padding-top: 10px;margin-left: 90px">
|
|
|
+ <el-image :src="sign" />
|
|
|
+ </div>
|
|
|
+ <div style="display: flex;align-items: center">
|
|
|
+ <el-text
|
|
|
+ style="margin-left: 10px"
|
|
|
+ size="large"
|
|
|
+ tag="b"
|
|
|
+ >项目基本信息</el-text>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-form>
|
|
|
+ <el-row
|
|
|
+ style="margin:20px 0 0 90px;height: 50px"
|
|
|
+ align="middle"
|
|
|
+ >
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item
|
|
|
+ label="项目名称："
|
|
|
+ size="large"
|
|
|
+ prop="name"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="basicMessage.name"
|
|
|
+ placeholder="请输入项目名称"
|
|
|
+ size="large"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col
|
|
|
+ :span="5"
|
|
|
+ :offset="2"
|
|
|
+ >
|
|
|
+ <el-form-item
|
|
|
+ label="负责人："
|
|
|
+ size="large"
|
|
|
+ prop="principal"
|
|
|
+ >
|
|
|
+ <el-select
|
|
|
+ v-model="responsible"
|
|
|
+ placeholder="请选择负责人"
|
|
|
+ @change="headSelect"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in userList"
|
|
|
+ :key="item.ID"
|
|
|
+ :label="item.nickName"
|
|
|
+ :value="item.nickName"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col
|
|
|
+ :span="5"
|
|
|
+ :offset="2"
|
|
|
+ >
|
|
|
+ <el-form-item
|
|
|
+ label="相关客户："
|
|
|
+ size="large"
|
|
|
+ prop="customer"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="basicMessage.customer"
|
|
|
+ placeholder="请输入项目相关客户"
|
|
|
+ size="large"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row
|
|
|
+ style="margin:20px 0 0 90px;height: 50px"
|
|
|
+ align="middle"
|
|
|
+ >
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item
|
|
|
+ label="紧急程度："
|
|
|
+ size="large"
|
|
|
+ >
|
|
|
+ <el-radio-group
|
|
|
+ v-model="basicMessage.level"
|
|
|
+ @change="changeUrgency"
|
|
|
+ >
|
|
|
+ <el-radio :value="1">正常</el-radio>
|
|
|
+ <el-radio :value="2">重要</el-radio>
|
|
|
+ <el-radio :value="3">紧急</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col
|
|
|
+ :span="6"
|
|
|
+ :offset="2"
|
|
|
+ >
|
|
|
+ <el-form-item
|
|
|
+ label="项目金额："
|
|
|
+ size="large"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="basicMessage.price"
|
|
|
+ style="max-width: 600px"
|
|
|
+ placeholder="请输入项目的具体金额"
|
|
|
+ class="input-with-select"
|
|
|
+ >
|
|
|
+ <template #append>
|
|
|
+ <el-select
|
|
|
+ v-model="amountUnit"
|
|
|
+ placeholder="元"
|
|
|
+ style="width: 100px"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ label="元"
|
|
|
+ :value="1"
|
|
|
+ />
|
|
|
+ <el-option
|
|
|
+ label="万元"
|
|
|
+ :value="2"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ </el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row
|
|
|
+ style="margin:20px 0 0 90px;height: 70px"
|
|
|
+ >
|
|
|
+ <el-col :span="19">
|
|
|
+ <el-form-item
|
|
|
+ label="项目说明："
|
|
|
+ size="large"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="basicMessage.illustrate"
|
|
|
+ type="textarea"
|
|
|
+ placeholder="项目说明"
|
|
|
+ :rows="3"
|
|
|
+ size="large"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="height: 400px;margin-top: 20px"
|
|
|
+ class="bg-white"
|
|
|
+ >
|
|
|
+ <div class="basicInformation">
|
|
|
+ <div style="padding-top: 10px;margin-left: 90px">
|
|
|
+ <el-image :src="sign" />
|
|
|
+ </div>
|
|
|
+ <div style="display: flex;align-items: center">
|
|
|
+ <el-text
|
|
|
+ style="margin-left: 10px"
|
|
|
+ size="large"
|
|
|
+ tag="b"
|
|
|
+ >项目附属文件</el-text>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-row style="margin:20px 0 0 90px;">
|
|
|
+ <el-col :span="15">
|
|
|
+ <el-upload
|
|
|
+ class="upload-demo"
|
|
|
+ drag
|
|
|
+ multiple
|
|
|
+ :auto-upload="false"
|
|
|
+ :file-list="fileListData"
|
|
|
+ :on-change="changeFileData"
|
|
|
+ :on-remove="removeFileData"
|
|
|
+ >
|
|
|
+ <el-icon class="el-icon--upload"><upload-filled /></el-icon>
|
|
|
+ <div class="el-upload__text">
|
|
|
+ 请选择需要上传的文件
|
|
|
+ </div>
|
|
|
+ <template #tip>
|
|
|
+ <div class="el-upload__tip">
|
|
|
+ 选择的文件不要超过500MB
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-upload>
|
|
|
+ </el-col>
|
|
|
+ <el-col
|
|
|
+ :span="4"
|
|
|
+ :offset="1"
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ icon="Collection"
|
|
|
+ size="large"
|
|
|
+ type="primary"
|
|
|
+ @click="approval"
|
|
|
+ >项目立项</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, reactive } from 'vue'
|
|
|
+import sign from '@/assets/sign.png'
|
|
|
+import moment from 'moment/moment'
|
|
|
+import { createProject } from '@/api/project'
|
|
|
+import { getAllUsers } from '@/api/user'
|
|
|
+defineOptions({
|
|
|
+ name: 'ProjectApproval'
|
|
|
+})
|
|
|
+// 表单验证规则
|
|
|
+// const fromRules = {
|
|
|
+// name: [{ required: true, message: '项目名称不能为空', trigger: 'blur' }],
|
|
|
+// principal: [{ required: true, message: '项目负责人不能为空', trigger: 'blur' }],
|
|
|
+// customer: [{ required: true, message: '项目相关用户不能为空', trigger: 'blur' }]
|
|
|
+// }
|
|
|
+// 项目基本信息
|
|
|
+const basicMessage = reactive({
|
|
|
+ code: '',
|
|
|
+ name: '',
|
|
|
+ principal: '',
|
|
|
+ price: 0,
|
|
|
+ level: 1,
|
|
|
+ customer: '',
|
|
|
+ illustrate: '',
|
|
|
+ progress: 0,
|
|
|
+ state: 1
|
|
|
+})
|
|
|
+// 项目用户列表
|
|
|
+const userList = reactive([])
|
|
|
+getAllUsers().then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ userList.push(...res.data)
|
|
|
+ }
|
|
|
+})
|
|
|
+// 选择的责任人
|
|
|
+const responsible = ref('')
|
|
|
+// 项目文件列表
|
|
|
+let fileListData = reactive([])
|
|
|
+// 金额单位
|
|
|
+const amountUnit = ref('元')
|
|
|
+// 修改负责人
|
|
|
+const headSelect = (value) => {
|
|
|
+ responsible.value = value
|
|
|
+ userList.forEach(item => {
|
|
|
+ if (value === item.nickName) {
|
|
|
+ basicMessage.principal = item.ID
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+// 修改文件数据
|
|
|
+const changeFileData = (file, fileList) => {
|
|
|
+ fileListData.push(...fileList)
|
|
|
+ console.log(fileListData)
|
|
|
+}
|
|
|
+const removeFileData = (file, fileList) => {
|
|
|
+ fileListData = fileList
|
|
|
+ console.log(fileListData)
|
|
|
+}
|
|
|
+// 项目紧急程度
|
|
|
+function changeUrgency(value) {
|
|
|
+ basicMessage.level = value
|
|
|
+}
|
|
|
+// 项目立项
|
|
|
+const approval = () => {
|
|
|
+ const basic = basicMessage
|
|
|
+ basic.code = 'LCZM' + createCode()
|
|
|
+ if (amountUnit.value === '万元') {
|
|
|
+ basic.price = parseInt(basic.price) * 10000
|
|
|
+ }
|
|
|
+ const formData = new FormData()
|
|
|
+ const json = JSON.stringify(basic)
|
|
|
+ console.log(typeof basic)
|
|
|
+ formData.append('file', fileListData)
|
|
|
+ formData.append('project', json)
|
|
|
+ console.log(formData.get('project'))
|
|
|
+ createProject(formData).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const createCode = () => {
|
|
|
+ console.log(moment().format('YYYYMMDDHHmm'))
|
|
|
+ return moment().format('YYYYMMDDHHmm')
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="less">
|
|
|
+.basicInformation{
|
|
|
+ height: 40px;
|
|
|
+ background-color: #f8fafd;
|
|
|
+ display: flex;
|
|
|
+ //align-items: center;
|
|
|
+}
|
|
|
+</style>
|
