|
|
@@ -2,135 +2,183 @@
|
|
|
<div class="create-container">
|
|
|
<div class="create-body">
|
|
|
<div class="title">创建项目</div>
|
|
|
- <el-form :model="project" :rules="rules" ref="project" label-width="12%" class="demo-report">
|
|
|
- <el-form-item label="项目名称" prop="name">
|
|
|
- <el-input v-if="isModifyMode" v-model="project.name"></el-input>
|
|
|
- <span v-if="!isModifyMode">{{project.name}}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="项目描述" prop="name">
|
|
|
- <el-input v-if="isModifyMode" v-model="project.description"></el-input>
|
|
|
- <span v-if="!isModifyMode">{{project.description}}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="联系人姓名" prop="name">
|
|
|
- <el-input v-if="isModifyMode" v-model="project.contactName"></el-input>
|
|
|
- <span v-if="!isModifyMode">{{project.contactName}}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="联系人电话" prop="name">
|
|
|
- <el-input v-if="isModifyMode" v-model="project.contactPhone"></el-input>
|
|
|
- <span v-if="!isModifyMode">{{project.contactPhone}}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="项目定价" prop="name">
|
|
|
- <el-input v-if="isModifyMode" v-model="project.price"></el-input>
|
|
|
- <span v-if="!isModifyMode">{{project.resource}}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="平台" prop="platform">
|
|
|
- <el-checkbox-group v-if="isModifyMode" v-model="project.platform">
|
|
|
- <el-checkbox label="0">IOS</el-checkbox>
|
|
|
- <el-checkbox label="1">ANDROID</el-checkbox>
|
|
|
- <el-checkbox label="2">WEB</el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
- <span
|
|
|
- v-if="!isModifyMode"
|
|
|
- class="badge"
|
|
|
- v-for="item in project.platform"
|
|
|
- >{{platformType[item]}}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="服务类型" prop="type">
|
|
|
- <el-checkbox-group v-if="isModifyMode" v-model="project.type">
|
|
|
- <el-checkbox label="0" name="type">{{serviceType[0]}}</el-checkbox>
|
|
|
- <el-checkbox label="1" name="type">{{serviceType[1]}}</el-checkbox>
|
|
|
- <el-checkbox label="2" name="type">{{serviceType[2]}}</el-checkbox>
|
|
|
- <el-checkbox label="3" name="type">{{serviceType[3]}}</el-checkbox>
|
|
|
- <el-checkbox label="4" name="type">{{serviceType[4]}}</el-checkbox>
|
|
|
- <el-checkbox label="5" name="type">{{serviceType[5]}}</el-checkbox>
|
|
|
- <el-checkbox label="6" name="type">{{serviceType[6]}}</el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
- <span v-if="!isModifyMode" class="badge" v-for="item in project.type">{{serviceType[item]}}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="file" label="项目需求文档">
|
|
|
- <el-upload
|
|
|
- v-if="isModifyMode"
|
|
|
- drag
|
|
|
- class="upload-demo"
|
|
|
- action="https://jsonplaceholder.typicode.com/posts/"
|
|
|
- :on-remove="handleRemove"
|
|
|
- :before-remove="beforeRemove"
|
|
|
- multiple
|
|
|
- :limit="1"
|
|
|
- :on-exceed="handleExceed"
|
|
|
- :before-upload="beforeFileUpload"
|
|
|
- :file-list="project.requireDoc"
|
|
|
- >
|
|
|
- <i class="el-icon-upload"></i>
|
|
|
- <div class="el-upload__text">
|
|
|
- 将文件拖到此处,或
|
|
|
- <em>点击上传</em>
|
|
|
- </div>
|
|
|
- <div class="el-upload__tip" slot="tip">请上传报告文件</div>
|
|
|
- </el-upload>
|
|
|
- <div v-if="!isModifyMode">
|
|
|
- <span v-if="project.file==null">暂无文件</span>
|
|
|
- <a :href="project.photo" v-if="project.photo!=null"><i class="fa fa-file-text-o"></i>
|
|
|
- {{project.photo}}</a>
|
|
|
- </div>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="file" label="项目待测文件">
|
|
|
- <el-upload
|
|
|
- v-if="isModifyMode"
|
|
|
- drag
|
|
|
- class="upload-demo"
|
|
|
- action="https://jsonplaceholder.typicode.com/posts/"
|
|
|
- :on-remove="handleRemove"
|
|
|
- :before-remove="beforeRemove"
|
|
|
- multiple
|
|
|
- :limit="1"
|
|
|
- :on-exceed="handleExceed"
|
|
|
- :before-upload="beforeFileUpload"
|
|
|
- :file-list="project.file"
|
|
|
- >
|
|
|
- <i class="el-icon-upload"></i>
|
|
|
- <div class="el-upload__text">
|
|
|
- 将文件拖到此处,或
|
|
|
- <em>点击上传</em>
|
|
|
- </div>
|
|
|
- <div class="el-upload__tip" slot="tip">请上传报告文件</div>
|
|
|
- </el-upload>
|
|
|
- <div v-if="!isModifyMode">
|
|
|
- <span v-if="project.file==null">暂无文件</span>
|
|
|
- <a :href="project.photo" v-if="project.photo!=null"><i class="fa fa-file-text-o"></i>
|
|
|
- {{project.photo}}</a>
|
|
|
- </div>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="项目截止时间" prop="datetime">
|
|
|
- <div class="block" v-if="isModifyMode">
|
|
|
- <el-date-picker
|
|
|
- v-model="project.datetime"
|
|
|
- type="datetime"
|
|
|
- placeholder="选择截止时间"
|
|
|
- align="right"
|
|
|
- :picker-options="pickerOptions"
|
|
|
- ></el-date-picker>
|
|
|
- </div>
|
|
|
- <span v-if="!isModifyMode">{{new Date(project.datetime)}}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item v-if="!isModifyMode">
|
|
|
- <div class="btn btn-medium btn-info" @click="modifyInfo()">修改</div>
|
|
|
- <div class="btn btn-medium" @click="cancelModify()">返回</div>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item v-if="isModifyMode">
|
|
|
- <div class="btn btn-primary btn-info" @click="submitInfo()">确认提交</div>
|
|
|
- <div class="btn btn-primary" @click="cancelModify()">取消</div>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
+ <el-tabs tabPosition="top" type="card">
|
|
|
+ <el-tab-pane label="表单创建项目">
|
|
|
+ <el-form :model="project" :rules="rules" ref="project" label-width="12%" class="demo-report">
|
|
|
+ <el-form-item label="项目名称" prop="name">
|
|
|
+ <el-input v-if="isModifyMode" v-model="project.name"></el-input>
|
|
|
+ <span v-if="!isModifyMode">{{project.name}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="项目描述" prop="name">
|
|
|
+ <el-input v-if="isModifyMode" v-model="project.description"></el-input>
|
|
|
+ <span v-if="!isModifyMode">{{project.description}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系人姓名" prop="name">
|
|
|
+ <el-input v-if="isModifyMode" v-model="project.contactName"></el-input>
|
|
|
+ <span v-if="!isModifyMode">{{project.contactName}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系人电话" prop="name">
|
|
|
+ <el-input v-if="isModifyMode" v-model="project.contactPhone"></el-input>
|
|
|
+ <span v-if="!isModifyMode">{{project.contactPhone}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="项目定价" prop="name">
|
|
|
+ <el-input v-if="isModifyMode" v-model="project.price"></el-input>
|
|
|
+ <span v-if="!isModifyMode">{{project.resource}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="平台" prop="platform">
|
|
|
+ <el-checkbox-group v-if="isModifyMode" v-model="project.platform">
|
|
|
+ <el-checkbox label="0">IOS</el-checkbox>
|
|
|
+ <el-checkbox label="1">ANDROID</el-checkbox>
|
|
|
+ <el-checkbox label="2">WEB</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ <span
|
|
|
+ v-if="!isModifyMode"
|
|
|
+ class="badge"
|
|
|
+ v-for="item in project.platform"
|
|
|
+ >{{platformType[item]}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="服务类型" prop="type">
|
|
|
+ <el-checkbox-group v-if="isModifyMode" v-model="project.type">
|
|
|
+ <el-checkbox label="0" name="type">{{serviceType[0]}}</el-checkbox>
|
|
|
+ <el-checkbox label="1" name="type">{{serviceType[1]}}</el-checkbox>
|
|
|
+ <el-checkbox label="2" name="type">{{serviceType[2]}}</el-checkbox>
|
|
|
+ <el-checkbox label="3" name="type">{{serviceType[3]}}</el-checkbox>
|
|
|
+ <el-checkbox label="4" name="type">{{serviceType[4]}}</el-checkbox>
|
|
|
+ <el-checkbox label="5" name="type">{{serviceType[5]}}</el-checkbox>
|
|
|
+ <el-checkbox label="6" name="type">{{serviceType[6]}}</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ <span v-if="!isModifyMode" class="badge" v-for="item in project.type">{{serviceType[item]}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="file" label="项目需求文档">
|
|
|
+ <el-upload
|
|
|
+ v-if="isModifyMode"
|
|
|
+ drag
|
|
|
+ class="upload-demo"
|
|
|
+ action="https://jsonplaceholder.typicode.com/posts/"
|
|
|
+ :on-remove="handleRemove"
|
|
|
+ :before-remove="beforeRemove"
|
|
|
+ multiple
|
|
|
+ :limit="1"
|
|
|
+ :on-exceed="handleExceed"
|
|
|
+ :before-upload="beforeFileUpload"
|
|
|
+ :file-list="project.requireDoc"
|
|
|
+ >
|
|
|
+ <i class="el-icon-upload"></i>
|
|
|
+ <div class="el-upload__text">
|
|
|
+ 将文件拖到此处,或
|
|
|
+ <em>点击上传</em>
|
|
|
+ </div>
|
|
|
+ <div class="el-upload__tip" slot="tip">请上传报告文件</div>
|
|
|
+ </el-upload>
|
|
|
+ <div v-if="!isModifyMode">
|
|
|
+ <span v-if="project.file==null || project.file.length === 0">暂无文件</span>
|
|
|
+ <a :href="project.file[0]" v-if="project.file!=null && project.file.length > 0"><i
|
|
|
+ class="fa fa-file-text-o"></i>
|
|
|
+ {{project.file[0]}}</a>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="file" label="项目待测文件">
|
|
|
+ <el-upload
|
|
|
+ v-if="isModifyMode"
|
|
|
+ drag
|
|
|
+ class="upload-demo"
|
|
|
+ action="https://jsonplaceholder.typicode.com/posts/"
|
|
|
+ :on-remove="handleRemove"
|
|
|
+ :before-remove="beforeRemove"
|
|
|
+ multiple
|
|
|
+ :limit="1"
|
|
|
+ :on-exceed="handleExceed"
|
|
|
+ :before-upload="beforeFileUpload"
|
|
|
+ :file-list="project.file"
|
|
|
+ >
|
|
|
+ <i class="el-icon-upload"></i>
|
|
|
+ <div class="el-upload__text">
|
|
|
+ 将文件拖到此处,或
|
|
|
+ <em>点击上传</em>
|
|
|
+ </div>
|
|
|
+ <div class="el-upload__tip" slot="tip">请上传报告文件</div>
|
|
|
+ </el-upload>
|
|
|
+ <div v-if="!isModifyMode">
|
|
|
+ <span v-if="project.file==null || project.file.length === 0">暂无文件</span>
|
|
|
+ <a :href="project.file[0]" v-if="project.file!=null && project.file.length > 0"><i
|
|
|
+ class="fa fa-file-text-o"></i>
|
|
|
+ {{project.file[0]}}</a>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="项目截止时间" prop="datetime">
|
|
|
+ <div class="block" v-if="isModifyMode">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="project.datetime"
|
|
|
+ type="datetime"
|
|
|
+ placeholder="选择截止时间"
|
|
|
+ align="right"
|
|
|
+ :picker-options="pickerOptions"
|
|
|
+ ></el-date-picker>
|
|
|
+ </div>
|
|
|
+ <span v-if="!isModifyMode">{{new Date(project.datetime)}}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-if="!isModifyMode">
|
|
|
+ <div class="btn btn-medium btn-info" @click="modifyInfo()">修改</div>
|
|
|
+ <div class="btn btn-medium" @click="cancelModify()">返回</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-if="isModifyMode">
|
|
|
+ <div class="btn btn-primary btn-info" @click="submitInfo()">确认提交</div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="上传Excel创建项目">
|
|
|
+ <el-form :model="project" :rules="rules" ref="project" label-width="12%" class="demo-report">
|
|
|
+ <el-form-item prop="file" label="Excel模板文件">
|
|
|
+ <div>
|
|
|
+ <span v-if="project.file==null || project.file.length === 0">暂无文件</span>
|
|
|
+ <a :href="project.file" v-if="project.file!=null && project.file.length > 0"><i
|
|
|
+ class="fa fa-file-text-o"></i>
|
|
|
+ {{project.file[0]}}</a>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="file" label="Excel文件">
|
|
|
+ <el-upload
|
|
|
+ v-if="isModifyMode"
|
|
|
+ drag
|
|
|
+ class="upload-demo"
|
|
|
+ action="https://jsonplaceholder.typicode.com/posts/"
|
|
|
+ :on-remove="handleRemove"
|
|
|
+ :before-remove="beforeRemove"
|
|
|
+ multiple
|
|
|
+ :limit="1"
|
|
|
+ :on-exceed="handleExceed"
|
|
|
+ :before-upload="beforeFileUpload"
|
|
|
+ :file-list="project.file"
|
|
|
+ >
|
|
|
+ <i class="el-icon-upload"></i>
|
|
|
+ <div class="el-upload__text">
|
|
|
+ 将文件拖到此处,或
|
|
|
+ <em>点击上传</em>
|
|
|
+ </div>
|
|
|
+ <div class="el-upload__tip" slot="tip">请上传报告文件</div>
|
|
|
+ </el-upload>
|
|
|
+ <div v-if="!isModifyMode">
|
|
|
+ <span v-if="project.file==null">暂无文件</span>
|
|
|
+ <a :href="project.file" v-if="project.file!=null"><i class="fa fa-file-text-o"></i>
|
|
|
+ {{project.file}}</a>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item v-if="isModifyMode">
|
|
|
+ <div class="btn btn-primary btn-info" @click="submitByFile()">确认提交</div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import Http from '../../js/http'
|
|
|
-import Apis from '../../js/api'
|
|
|
-import ServiceType from '../../constants/enum/service-type'
|
|
|
-import Platform from '../../constants/enum/platform-type'
|
|
|
+import Http from '@/js/http.js'
|
|
|
+import Apis from '@/js/api.js'
|
|
|
+import ServiceType from '@/constants/enum/service-type.js'
|
|
|
+import PlatformType from '@/constants/enum/platform-type.js'
|
|
|
|
|
|
export default {
|
|
|
name: 'ProjectAdd',
|
|
|
@@ -139,7 +187,8 @@ export default {
|
|
|
userId: 0,
|
|
|
isModifyMode: true,
|
|
|
serviceType: ServiceType,
|
|
|
- platform: Platform,
|
|
|
+ platform: PlatformType,
|
|
|
+ isFormSubmit: true,
|
|
|
project: {
|
|
|
name: '',
|
|
|
description: '',
|
|
|
@@ -148,7 +197,7 @@ export default {
|
|
|
platform: [],
|
|
|
type: [],
|
|
|
requireDoc: [],
|
|
|
- file: [],
|
|
|
+ file: ['123.xls'],
|
|
|
price: '',
|
|
|
datetime: ''
|
|
|
},
|
|
|
@@ -224,6 +273,14 @@ export default {
|
|
|
console.log(res)
|
|
|
})
|
|
|
},
|
|
|
+ submitByFile () {
|
|
|
+ const data = {
|
|
|
+ file: this.project.file[0]
|
|
|
+ }
|
|
|
+ Http.post(Apis.PROJECT.ADD_PROJECT_BY_EXCEL, data).then((res) => {
|
|
|
+ console.log(res)
|
|
|
+ })
|
|
|
+ },
|
|
|
cancelModify () {
|
|
|
this.isModifyMode = false
|
|
|
},
|
|
|
@@ -242,6 +299,9 @@ export default {
|
|
|
},
|
|
|
beforeFileUpload () {
|
|
|
},
|
|
|
+ changeSubmitMethod () {
|
|
|
+ this.isFormSubmit = !this.isFormSubmit
|
|
|
+ }
|
|
|
},
|
|
|
created: function () {
|
|
|
}
|