|
|
@@ -0,0 +1,182 @@
|
|
|
+<template>
|
|
|
+ <normal-dialog
|
|
|
+ :show-dialog.sync="show"
|
|
|
+ :title="title"
|
|
|
+ :is-default-close="false"
|
|
|
+ width="60%"
|
|
|
+ @confirm="confirmForm()"
|
|
|
+ @cancel="cancel()"
|
|
|
+ >
|
|
|
+ <article>
|
|
|
+ <h2 class="form-title">需求范围</h2>
|
|
|
+ <el-form ref="form" :model="formData" label-width="100px" label-position="left">
|
|
|
+ <el-form-item :label="type === 'require'?'需求方向':'任务方向'">
|
|
|
+ <el-select v-model="formData.direction" placeholder="请选择" size="small">
|
|
|
+ <el-option label="区域一" value="shanghai" />
|
|
|
+ <el-option label="区域二" value="beijing" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <el-form ref="form" :model="formData" label-width="100px" label-position="left" :inline="true">
|
|
|
+ <el-form-item label="跟版客户端">
|
|
|
+ <el-select v-model="formData.app" placeholder="请选择" size="small">
|
|
|
+ <el-option v-for="item in appClientList" :key="'app'+item.code" :label="item.msg" :value="item.code" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-select v-model="formData.client" placeholder="请选择" size="small">
|
|
|
+ <el-option v-for="item in clientList" :key="'client'+item.code" :label="item.msg" :value="item.code" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <h2 class="form-title">通知条件</h2>
|
|
|
+ <el-form ref="form" :model="formData" label-width="100px" label-position="left">
|
|
|
+ <el-form-item v-for="(item,index) in formData.conditionList" :key="'condition'+index" label="条件">
|
|
|
+ <el-select v-model="item.type" placeholder="请选择" size="small" class="condition-select">
|
|
|
+ <el-option v-for="key in requireTypeList" :key="key.label" :label="key.label" :value="key.value" />
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="item.status" placeholder="请选择" size="small" class="condition-select">
|
|
|
+ <el-option v-for="key in requireTypeList" :key="key.label" :label="key.label" :value="key.value" />
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="item.delay" placeholder="请选择" size="small" class="condition-select">
|
|
|
+ <el-option v-for="key in requireTypeList" :key="key.label" :label="key.label" :value="key.value" />
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="item.more" placeholder="请选择" size="small" class="condition-select">
|
|
|
+ <el-option v-for="key in requireTypeList" :key="key.label" :label="key.label" :value="key.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <div class="add-condition" @click="addCondition()"><i class="el-icon-circle-plus-outline" /> 添加条件</div>
|
|
|
+ </el-form>
|
|
|
+ </article>
|
|
|
+ </normal-dialog>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { showAppClientEnum } from '@/api/version.js'
|
|
|
+import normalDialog from '@/components/dialog/normalDialog'
|
|
|
+export default {
|
|
|
+ components: { normalDialog },
|
|
|
+ props: {
|
|
|
+ data: {
|
|
|
+ type: Object,
|
|
|
+ default: () => null,
|
|
|
+ required: false
|
|
|
+ },
|
|
|
+ visible: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ required: true
|
|
|
+ },
|
|
|
+ type: {
|
|
|
+ type: String,
|
|
|
+ default: 'require', // 需求:require,任务:task
|
|
|
+ required: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ title: '新建需求定时通知',
|
|
|
+ formData: {
|
|
|
+ direction: null,
|
|
|
+ app: null,
|
|
|
+ client: null,
|
|
|
+ conditionList: []
|
|
|
+ },
|
|
|
+ show: this.visible, // 显示弹框
|
|
|
+ appClientList: [], // 客户端选择列表
|
|
|
+ requireTypeList: [{ label: '需求状态', value: 0 }, { label: '需求事件', value: 1 }] // 需求条件类型选择列表
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ clientList: { // 版本列表
|
|
|
+ get() {
|
|
|
+ if (this.formData.app !== null) {
|
|
|
+ const obj = this.appClientList.find(item => item.code === this.formData.app)
|
|
|
+ return obj.childEnumInfos || []
|
|
|
+ } else {
|
|
|
+ return []
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ data: {
|
|
|
+ handler(newV) {
|
|
|
+ if (newV) {
|
|
|
+ this.formData = newV
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true,
|
|
|
+ immediate: true
|
|
|
+ },
|
|
|
+ visible: {
|
|
|
+ handler(newV) {
|
|
|
+ this.show = newV
|
|
|
+ },
|
|
|
+ deep: true,
|
|
|
+ immediate: true
|
|
|
+ },
|
|
|
+ 'formData.app': { // 客户端改变，版本默认取第一个版本
|
|
|
+ handler(newV) {
|
|
|
+ this.formData.client = this.clientList[0] || null
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.showAppClientEnum()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async showAppClientEnum() { // 获取客户端列表
|
|
|
+ const res = await showAppClientEnum()
|
|
|
+ if (res.code === 200) {
|
|
|
+ this.appClientList = res.data.appClient
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addCondition() { // 添加条件
|
|
|
+ this.formData.conditionList.push({
|
|
|
+ type: 0,
|
|
|
+ status: 0,
|
|
|
+ delay: 0,
|
|
|
+ more: 1
|
|
|
+ })
|
|
|
+ },
|
|
|
+ confirmForm() {
|
|
|
+ this.$emit('confirm')
|
|
|
+ },
|
|
|
+ cancel() {
|
|
|
+ this.show = false
|
|
|
+ this.$emit('update:visible', this.show)
|
|
|
+ this.$emit('cancel')
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+article{
|
|
|
+ padding: 0 45px;
|
|
|
+ .form-title {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ font-size: 18px;
|
|
|
+ color: #333333;
|
|
|
+ margin: 20px 0;
|
|
|
+ }
|
|
|
+ .form-title:nth-child(1){
|
|
|
+ margin-top: 0;
|
|
|
+ }
|
|
|
+ /deep/.el-form-item {
|
|
|
+ font-size: 14px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ label {
|
|
|
+ color: #666666;
|
|
|
+ font-weight: 400;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .condition-select {
|
|
|
+ width: 22%;
|
|
|
+ }
|
|
|
+ .add-condition {
|
|
|
+ cursor: pointer;
|
|
|
+ color: #409EFF;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
wangziqian