sql 节点增加收件人和抄送人

escheduler-ui/.env

@@ -1,6 +1,6 @@
 
 # 后端接口地址
-API_BASE = http://192.168.220.247:12345
+API_BASE = http://192.168.220.154:12345
 
 # 本地开发如需ip访问项目把"#"号去掉
 #DEV_HOST = 192.168.xx.xx

escheduler-ui/src/js/conf/home/pages/dag/_source/formModel/tasks/sql.vue

@@ -27,6 +27,20 @@
         </div>
       </div>
     </m-list-box>
+    <template v-if="!sqlType && showType.length">
+      <m-list-box>
+        <div slot="text">收件人</div>
+        <div slot="content">
+          <m-email v-model="receivers" :repeat-data="receiversCc"></m-email>
+        </div>
+      </m-list-box>
+      <m-list-box>
+        <div slot="text">抄送人</div>
+        <div slot="content">
+          <m-email v-model="receiversCc" :repeat-data="receivers"></m-email>
+        </div>
+      </m-list-box>
+    </template>
     <m-list-box v-show="type === 'HIVE'">
       <div slot="text">{{$t('SQL Parameter')}}</div>
       <div slot="content">
@@ -83,6 +97,7 @@
   import mDatasource from './_source/datasource'
   import mLocalParams from './_source/localParams'
   import disabledState from '@/module/mixin/disabledState'
+  import mEmail from '@/conf/home/pages/projects/pages/definition/pages/list/_source/email'
   import codemirror from '@/conf/home/pages/resource/pages/file/pages/_source/codemirror'
 
   let editor
@@ -108,7 +123,11 @@
         // Form/attachment
         showType: ['TABLE'],
         // Sql parameter
-        connParams: ''
+        connParams: '',
+        // recipients
+        receivers: [],
+        // copy to
+        receiversCc: []
       }
     },
     mixins: [disabledState],
@@ -174,6 +193,8 @@
           sql: editor.getValue(),
           udfs: this.udfs,
           sqlType: this.sqlType,
+          receivers: this.receivers.join(','),
+          receiversCc: this.receiversCc.join(','),
           showType: (() => {
             /**
              * Special processing return order TABLE,ATTACHMENT
@@ -223,12 +244,23 @@
         if (val) {
           this.showType = []
         }
+        if (val !== 0) {
+          this.receivers = []
+          this.receiversCc = []
+        }
       },
       // Listening data source
       type (val) {
         if (val !== 'HIVE') {
           this.connParams = ''
         }
+      },
+      //
+      showType (val) {
+        if (!val.length) {
+          this.receivers = []
+          this.receiversCc = []
+        }
       }
     },
     created () {
@@ -245,6 +277,8 @@
         this.connParams = o.params.connParams || ''
         this.localParams = o.params.localParams || []
         this.showType = o.params.showType.split(',') || []
+        this.receivers = o.params.receivers && o.params.receivers.split(',') || []
+        this.receiversCc = o.params.receiversCc && o.params.receiversCc.split(',') || []
       }
     },
     mounted () {
@@ -262,6 +296,6 @@
       }
     },
     computed: {},
-    components: { mListBox, mDatasource, mLocalParams, mUdfs, mSqlType }
+    components: { mListBox, mDatasource, mLocalParams, mUdfs, mSqlType, mEmail }
   }
 </script>

escheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/email.vue

@@ -3,7 +3,7 @@
     <div class="clearfix input-element">
       <span class="tag-wrapper" v-for="(item,$index) in activeList" :class="activeIndex === $index ? 'active' : ''">
         <span class="tag-text">{{item}}</span>
-        <i class="remove-tag ans-icon-close" @click="_del($index)"></i>
+        <i class="remove-tag ans-icon-close" @click.stop="_del($index)"></i>
       </span>
       <x-poptip
               placement="bottom-start"
@@ -15,7 +15,7 @@
           <div class="ans-scroller" style=" max-height: 300px;">
             <div class="scroll-area-wrapper scroll-transition">
               <ul class="dropdown-container">
-                <li class="ans-option" v-for="(item,$index) in emailList" @click="_selectEmail($index + 1)">
+                <li class="ans-option" v-for="(item,$index) in emailList" @click.stop="_selectEmail($index + 1)">
                   <span class="default-option-class" :class="index === ($index + 1) ? 'active' : ''">{{item}}</span>
                 </li>
               </ul>
@@ -212,7 +212,7 @@
        */
       _handlerEmailWitch () {
         setTimeout(() => {
-          this.emailWidth = parseInt(688 - $(this.$refs.emailInput).position().left - 20)
+          this.emailWidth = parseInt($('.email-model').width() - $(this.$refs.emailInput).position().left - 20)
           if (this.emailWidth < 80) {
             this.emailWidth = 200
           }
@@ -274,7 +274,7 @@
 
 <style lang="scss" rel="stylesheet/scss">
   .email-model {
-    width: 688px;
+    width: 100%;
     .input-element {
       min-height: 32px;
       padding: 1px 8px;

escheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/start.vue

@@ -83,7 +83,7 @@
       <div class="text">
         {{$t('Recipient')}}
       </div>
-      <div class="cont">
+      <div class="cont" style="width: 688px;">
         <m-email v-model="receivers" :repeat-data="receiversCc"></m-email>
       </div>
     </div>
@@ -91,7 +91,7 @@
       <div class="text">
         {{$t('Cc')}}
       </div>
-      <div class="cont">
+      <div class="cont" style="width: 688px;">
         <m-email v-model="receiversCc" :repeat-data="receivers"></m-email>
       </div>
     </div>

escheduler-ui/src/js/conf/home/pages/projects/pages/index/_source/projectChart.vue

@@ -7,7 +7,7 @@
                   :panel-num="2"
                   placement="bottom-end"
                   @on-change="_datepicker"
-                  :value="scheduleTime"
+                  :value="[searchParams.startDate,searchParams.endDate]"
                   type="daterange"
                   :placeholder="$t('Select date range')"
                   format="YYYY-MM-DD HH:mm:ss">
@@ -30,7 +30,7 @@
                       <th>{{$t('Number')}}</th>
                       <th>{{$t('State')}}</th>
                     </tr>
-                    <tr v-for="(item,$index) in taskCountDtosList">
+                    <tr v-for="(item,$index) in taskCtatusList">
                       <td><span>{{$index+1}}</span></td>
                       <td>
                         <span>
@@ -60,7 +60,65 @@
                       <th>{{$t('Number')}}</th>
                       <th>{{$t('State')}}</th>
                     </tr>
-                    <tr v-for="(item,$index) in processStateCountList">
+                    <tr v-for="(item,$index) in processStateList">
+                      <td><span>{{$index+1}}</span></td>
+                      <td><span><a href="javascript:" @click="id && _goProcess(item.key)" :class="id ?'links':''">{{item.value}}</a></span></td>
+                      <td><span class="ellipsis" style="width: 98%;" :title="item.key">{{item.key}}</span></td>
+                    </tr>
+                  </table>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="row" style="padding-top: 20px;">
+          <div class="col-md-6">
+            <div class="chart-title">
+              <span>命令状态统计</span>
+            </div>
+            <div class="row">
+              <div class="col-md-7">
+                <div id="command-state-pie" style="height:260px;margin-top: 100px;"></div>
+              </div>
+              <div class="col-md-5">
+                <div class="table-small-model">
+                  <table>
+                    <tr>
+                      <th width="40">{{$t('#')}}</th>
+                      <th>{{$t('Number')}}</th>
+                      <th>{{$t('State')}}</th>
+                    </tr>
+                    <tr v-for="(item,$index) in taskCtatusList">
+                      <td><span>{{$index+1}}</span></td>
+                      <td>
+                        <span>
+                          <a href="javascript:" @click="id && _goTask(item.key)" :class="id ?'links':''">{{item.value}}</a>
+                        </span>
+                      </td>
+                      <td><span class="ellipsis" style="width: 98%;" :title="item.key">{{item.key}}</span></td>
+                    </tr>
+                  </table>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="col-md-6">
+            <div class="chart-title">
+              <span>队列统计</span>
+            </div>
+            <div class="row">
+              <div class="col-md-7">
+                <div id="process-state-pie" style="height:260px;margin-top: 100px;"></div>
+              </div>
+              <div class="col-md-5">
+                <div class="table-small-model">
+                  <table>
+                    <tr>
+                      <th width="40">{{$t('#')}}</th>
+                      <th>{{$t('Number')}}</th>
+                      <th>{{$t('State')}}</th>
+                    </tr>
+                    <tr v-for="(item,$index) in processStateList">
                       <td><span>{{$index+1}}</span></td>
                       <td><span><a href="javascript:" @click="id && _goProcess(item.key)" :class="id ?'links':''">{{item.value}}</a></span></td>
                       <td><span class="ellipsis" style="width: 98%;" :title="item.key">{{item.key}}</span></td>
@@ -103,22 +161,27 @@
     name: 'perject-chart',
     data () {
       return {
-        taskCountDtosList: [],
+        isLoading: true,
-        processStateCountList: [],
+        taskCtatusList: [],
-        userList: [],
+        processStateList: [],
-        scheduleTime: ['2018-11-16 00:00:00', '2018-11-16 17:13:11'],
+        defineUserList: [],
-        isLoading: true
+        commandStateList: [],
+        searchParams: {
+          projectId: this.id,
+          startDate: '',
+          endDate: ''
+        }
       }
     },
     props: {
       id: Number
     },
     methods: {
-      ...mapActions('projects', ['getTaskCtatusCount', 'getProcessStateCount', 'getDefineUserCount']),
+      ...mapActions('projects', ['getTaskCtatusCount', 'getProcessStateCount', 'getDefineUserCount', 'getCommandStateCount', 'getQueueCount']),
       _datepicker (val) {
-        this.scheduleTime = val
+        this.searchParams.startDate = val[0]
-        this._stateTypePie()
+        this.searchParams.endDate = val[1]
-        this._processStatePie()
+        this._getData(false)
       },
       _goTask (name) {
         this.$router.push({
@@ -140,22 +203,17 @@
           }
         })
       },
-      _stateTypePie () {
+
-        this.taskCountDtosList = []
+      _handleTaskCtatus (res) {
-        this.getTaskCtatusCount({
-          projectId: this.id,
-          startDate: this.scheduleTime[0],
-          endDate: this.scheduleTime[1]
-        }).then(res => {
         let data = res.data.taskCountDtos
-          this.taskCountDtosList = _.map(data, v => {
+        this.taskCtatusList = _.map(data, v => {
           return {
             key: _.find(stateType, ['code', v.taskStateType])['label'],
             value: v.count,
             type: 'type'
           }
         })
-          const myChart = Chart.pie('#task-status-pie', this.taskCountDtosList, { title: '' })
+        const myChart = Chart.pie('#task-status-pie', this.taskCtatusList, { title: '' })
         myChart.echart.setOption(pie)
 
         // 首页不允许跳转
@@ -164,23 +222,16 @@
             this._goTask(e.data.name)
           })
         }
-        }).catch(e => {})
       },
-      _processStatePie () {
+      _handleProcessState (res) {
-        this.processStateCountList = []
-        this.getProcessStateCount({
-          projectId: this.id,
-          startDate: this.scheduleTime[0],
-          endDate: this.scheduleTime[1]
-        }).then(res => {
         let data = res.data.taskCountDtos
-          this.processStateCountList = _.map(data, v => {
+        this.processStateList = _.map(data, v => {
           return {
             key: _.find(stateType, ['code', v.taskStateType])['label'],
             value: v.count
           }
         })
-          const myChart = Chart.pie('#process-state-pie', this.processStateCountList, { title: '' })
+        const myChart = Chart.pie('#process-state-pie', this.processStateList, { title: '' })
         myChart.echart.setOption(pie)
         // 首页不允许跳转
         if (this.id) {
@@ -188,20 +239,16 @@
             this._goProcess(e.data.name)
           })
         }
-        }).catch(e => {})
       },
-      _processDefinitionBar () {
+      _handleDefineUser (res) {
-        this.getDefineUserCount({
-          projectId: this.id
-        }).then(res => {
         let data = res.data.userList
-          this.userList = _.map(data, v => {
+        this.defineUserList = _.map(data, v => {
           return {
             key: v.userName + ',' + v.userId + ',' + v.count,
             value: v.count
           }
         })
-          const myChart = Chart.bar('#process-definition-bar', this.userList, {})
+        const myChart = Chart.bar('#process-definition-bar', this.defineUserList, {})
         myChart.echart.setOption(bar)
         // 首页不允许跳转
         if (this.id) {
@@ -214,25 +261,49 @@
             })
           })
         }
-        }).catch(e => {})
-      }
       },
-    watch: {
+      _handleCommandState (res) {
+
       },
-    created () {
+      _handleQueue () {},
-      this.scheduleTime = [dayjs().format('YYYY-MM-DD 00:00:00'), dayjs().format('YYYY-MM-DD HH:mm:ss')]
+
+      _getData (is = true) {
         this.isLoading = true
-      Promise.all([
+        let ioList = [
-        this._stateTypePie(),
+          this.getTaskCtatusCount(this.searchParams),
-        this._processStatePie(),
+          this.getProcessStateCount(this.searchParams),
-        this._processDefinitionBar()
+          this.getCommandStateCount(this.searchParams),
-      ]).then(res => {
+          this.getQueueCount(this.searchParams)
+        ]
+
+        if (is) {
+          ioList.push(this.getDefineUserCount(_.pick(this.searchParams, ['projectId'])))
+        }
+
+        Promise.all(ioList).then(res => {
+          this._handleTaskCtatus(res[0])
+          this._handleProcessState(res[1])
+          this._handleCommandState(res[2])
+          this._handleQueue(res[3])
+          if (is) {
+            this._handleDefineUser(res[4])
+          }
           setTimeout(() => {
             this.isLoading = false
           }, 800)
         }).catch(e => {
+          console.log(e)
           this.isLoading = false
         })
+      }
+    },
+    watch: {
+    },
+    created () {
+      this.searchParams.startDate = dayjs().format('YYYY-MM-DD 00:00:00')
+      this.searchParams.endDate = dayjs().format('YYYY-MM-DD HH:mm:ss')
+      // init get data
+      this._getData()
     },
     mounted () {
 

escheduler-ui/src/js/conf/home/store/projects/actions.js

@@ -78,6 +78,30 @@ export default {
       })
     })
   },
+  /**
+   * get command state count
+   */
+  getCommandStateCount ({ state }, payload) {
+    return new Promise((resolve, reject) => {
+      io.get(`projects/analysis/command-state-count`, payload, res => {
+        resolve(res)
+      }).catch(e => {
+        reject(e)
+      })
+    })
+  },
+  /**
+   * get command state count
+   */
+  getQueueCount ({ state }, payload) {
+    return new Promise((resolve, reject) => {
+      io.get(`projects/analysis/queue-count`, payload, res => {
+        resolve(res)
+      }).catch(e => {
+        reject(e)
+      })
+    })
+  },
   /**
    * Process status statistics
    */