작업중 설정 진행 중 & 배치 모니터링 수정

2025-12-07 00:17:26 +09:00 · 2023-05-09 20:23:00 +09:00
parent 96fe1ec899
commit 081e9b8712
7 changed files with 126 additions and 137 deletions
--- a/frontend/src/modules/sysMgt/router/index.js
+++ b/frontend/src/modules/sysMgt/router/index.js
@@ -40,7 +40,7 @@ export default [
    meta: { public: false }
  },
  {
-    path: '/sysMgt/batchDetail/:batchId',
+    path: '/sysMgt/batchDetail',
    component: BatchDetail,    
    name: 'batchDetail',     
    meta: { public: false }
--- a/frontend/src/modules/sysMgt/service/sysMgtApi.js
+++ b/frontend/src/modules/sysMgt/service/sysMgtApi.js
@@ -85,6 +85,11 @@ const notiList = (params) => {
    return httpClient.post('/api/v1/bo/sysMgt/notiList', params, { withCredentials: false })
 }

+const setWorkState = (params) => {
+    console.log("api호출",params)
+    return httpClient.post('/api/v1/bo/sysMgt/setWorkState', params, { withCredentials: false })
+}
+

 export default {
    insertAdmin,
@@ -104,5 +109,6 @@ export default {
    batchList,
    batchDetail,
    batchExecuteJob,
-    notiList
+    notiList,
+    setWorkState,
  }
--- a/frontend/src/modules/sysMgt/views/BatchDetail.vue
+++ b/frontend/src/modules/sysMgt/views/BatchDetail.vue
@@ -9,7 +9,7 @@
      <div class="search_wrap">
        <div class="group">
          <h3>
-            <label for="right" class="label">배치 ID  |  {{ this.batchId }}  </label>
+            <label for="right" class="label">배치 ID  |  {{ this.batchId }} | {{ this.batchNm }} |  {{ this.batchType }} </label>
          </h3>
        </div>
        <div class="group">
@@ -57,10 +57,9 @@
            <div class="term">
              <span class="custom_input icon_date">
                  <vuejs-datepicker
-                      :language="ko"
-                      :format="customFormatter"
-                      :disabled-dates="disabledSDate"
-                      v-model="strDate"
+                    :language="ko"
+                    :format="customFormatter"
+                    v-model="strDate"
                  ></vuejs-datepicker>
              </span>
            </div>
@@ -107,7 +106,7 @@ export default {
  name: 'batchDetail',
  data() {
    return {
-      //paramBatchId : this.$route.params.batchId,
+      paramBatchId : this.$route.params.batchId,
      //날짜 조회
      ko: vdp_translation_ko.js,
      periodDay: 7,
@@ -120,8 +119,9 @@ export default {

      pageType: 'CALC',

-      batchId : this.$route.params.batchId,
-      batchNm : this.$route.params.batchNm,
+      batchId : this.$route.params.props.batchId,
+      batchNm : this.$route.params.props.batchNm,
+      batchType: this.$route.params.props.batchType,

      //상태조회
      sttusCd: '',
@@ -154,6 +154,8 @@ export default {
        noDataStr: '검색 결과가 없습니다.',
        params: {
          batchId : '',
+          batchType: '',
+          batchNm: '',
          sttusCd: '',
          startDt: '',
          endDt: '',
@@ -220,6 +222,8 @@ export default {
        startDt: moment(this.startDate).format('YYYYMMDD'),
        endDt: moment(this.endDate).format('YYYYMMDD'),
        batchId: this.batchId,
+        batchNm: this.batchNm,
+        batchType: this.batchType,
        sttusCd: this.sttusCd
      }
      this.$refs.table.search(this.grid.params, isKeep);
@@ -291,10 +295,14 @@ export default {
    },

    async runExecuteJob(){
+      console.log("this.strDate",this.strDate)
        const params = {
-          strDate : this.strDate,
-          batchId : this.batchId
+          strDate : moment(this.strDate).format('YYYY-MM-DD'),
+          batchId : this.batchId,
+          batchType : this.batchType,
+          batchNm : this.batchNm,
        }
+        console.log("params",params)
        try {
          const response = await sysMgtApi.batchExecuteJob(params);
          
--- a/frontend/src/modules/sysMgt/views/BatchList.vue
+++ b/frontend/src/modules/sysMgt/views/BatchList.vue
@@ -7,13 +7,21 @@
      </div>
      <div class="table">
        <custom-grid ref="table" :url="grid.url" :columns="grid.columns"></custom-grid>
+        <router-link 
+          :to="{
+            name: 'batchDetail',
+            params: { batchId : 'BATCH_003'}
+          }">
+        </router-link>
      </div>
    </div>
+    
  </div>
 </template>

 <script>
 import customGrid from '@/components/CustomGrid';
+import batchDetail from './BatchDetail.vue'

 class CustomATagRenderer {
  constructor(props) {
@@ -62,7 +70,7 @@ export default {
            renderer: {
              type: CustomATagRenderer,
              options: {
-                callback: this.batchDetail,
+                callback: this.goBatchDetail,
              },
            },
          },
@@ -77,6 +85,7 @@ export default {
  },
  components: {
    customGrid: customGrid,
+    batchDetail: batchDetail,
  },
  created() {
    const getCondition = this.$store.getters['searchcondition/getSearchCondition'];
@@ -112,9 +121,12 @@ export default {
      this.$refs.table.search(this.grid.params, isKeep);
      this.sendStoreData();
    },
-    batchDetail(props) {
-      this.row.batchId = props.batchId;
-      this.$router.push({ path: `/sysMgt/batchDetail/${props.batchId}`, params: this.row });
+    goBatchDetail(props) {
+      // this.row = props
+      // console.log("props1",props.getters)
+      // console.log("props2",props)
+
+      this.$router.push({ name: "batchDetail", params: {props: props} });
    },
    sendStoreData: function () {
      const getP = this.$refs.table.getPagination();
--- a/frontend/src/modules/sysMgt/views/WorkState.vue
+++ b/frontend/src/modules/sysMgt/views/WorkState.vue
@@ -14,38 +14,35 @@
                <vuejs-datepicker
                    :language="ko"
                    :format="customFormatter"
-                    :disabled-dates="disabledSDate"
                    v-model="startDate"
-                    @selected="selectedStartDate(0)"
-                    @closed="closeDate('start')"
                ></vuejs-datepicker>
              </span>
            </div>
          </div>
-          <div>
+          <div style="margin-right: 20px;">
            <label for="right" class="label">시작시간</label>
            <div class="term">
              <span class="custom_input icon_date">
-                <vue-timepicker v-model="StartTime" format="hh:mm A" :minute-interval="10"></vue-timepicker>
+                <vue-timepicker v-model="startTime" :minuteInterval="10"></vue-timepicker>
              </span>
            </div>
          </div>
-          <div>
+          <div style="margin-right: 30px;">
            <label for="right" class="label">종료시간</label>
            <div class="term">
              <span class="custom_input icon_date">
-                <vue-timepicker v-model="EndTime" format="hh:mm A" :minute-interval="10"></vue-timepicker>
+                <vue-timepicker v-model="endTime" :minuteInterval="10"></vue-timepicker>
              </span>
            </div>
          </div>
          <div>
-            <input type="radio" name="state" value="use" id="popup_radio1">
-            <label for="popup_radio1">사용</label>
-            <input type="radio" name="state" value="notUse" id="popup_radio2">
-            <label for="popup_radio2">점검중</label>
+            <input type="radio" v-model="state" name="state" value="use" id="popup_radio1">
+            <label for="popup_radio1" style="margin-right: 20px;">사용</label>
+            <input type="radio" v-model="state" name="state" value="notUse" id="popup_radio2">
+            <label for="popup_radio2" style="margin-right: 30px;">점검중</label>
          </div>
          <div>
-            <button type="button" class="button grey" @click="save">저장</button>
+            <button type="button" class="button grey" @click="fnSaveTxt">저장</button>
          </div>
        </div>
      </div>
@@ -68,52 +65,20 @@

 <script>
 import customGrid from '@/components/CustomGrid';
-import Timepicker from 'vue-timepicker';
-
-class CustomATagRenderer {
-  constructor(props) {
-    this.props = props;
-    const el = document.createElement('a');
-    el.href = 'javascript:void(0);';
-    el.className = 'btn_text';
-    el.innerText = String(props.colValue);
-    this.el = el;
-  }
-
-  getElement() {
-    return this.el;
-  }
-
-  addEvent(selEl) {
-    selEl.addEventListener('click', () => {
-      const { callback } = this.props['cgrido' + this.props.colName].options;
-      callback(this.props);
-    });
-  }
-}
-
-
+import moment from 'moment';
+import VueTimepicker from 'vue2-timepicker';
+import 'vue2-timepicker/dist/VueTimepicker.css'
+import sysMgtApi from '../service/sysMgtApi'

 export default {
  name: 'workState',
  data() {
    return {
      isFocused: false,
-      srchGbn: '00',
-      srchGbn2: '00',
-      row: {},
-      perPageCnt: 50,
-      options: [
-        { text: '20', value: 20 },
-        { text: '50', value: 50 },
-        { text: '100', value: 100 },
-      ],
      //날짜 조회
      ko: vdp_translation_ko.js,
-      periodDay: 7,
      sDateDiv: 'day',
      startDate: new Date(),
-
      totalItems: 0,
      grid: {
        url: '/api/v1/bo/sysMgt/notiList',
@@ -122,45 +87,32 @@ export default {
        addCls: 'box_OFvis',
        initialRequest: false,
        columns: [
-          { name: 'sndYmd', header: '발송 날짜', align: 'center', width: '15%' },
-          { name: 'userId', header: '유저 ID', align: 'center', width: '15%' },
-          { name: 'notiDiv', header: '알림 구분', align: 'center', width: '15%' },
-          { name: 'webReqId', header: '웹요청 ID', align: 'center', width: '20%' },
-          // { name: 'regDt', header: '등록 일시', align: 'center', width: '15%' },
+          { name: 'day', header: '날짜', align: 'center', width: '15%' },
+          { name: 'userId', header: '시작 시간', align: 'center', width: '15%' },
+          { name: 'notiDiv', header: '종료 시간', align: 'center', width: '15%' },
+          { name: 'webReqId', header: '상태 변경', align: 'center', width: '20%' },
        ],
        noDataStr: '발송 내역이 없습니다.',
        params: {
-          startDt: '',
-          endDt: '',
-          search: '',
-          srchGbn: '',
-          srchGbn2: ''
        },
-        StartTime : null,
-        EndTime : null,
+        startTime : '',
+        endTime : '',
+        state: 'use'
      },
    };
  },
  components: {
    customGrid: customGrid,
    vuejsDatepicker,
-    Timepicker,
+    VueTimepicker,

  },
  created() {
-    this.setPeriodDay(0);
  },
  destroyed() {
    // this.$store.commit('dataStore/updateDataStore', '');
    this.$store.commit('searchcondition/updateSearchCondition', {
-      page: 1,
-      perPage: 50,
      params: {
-        startDt: '',
-        endDt: '',
-        search: '',
-        srchGbn: '',
-        srchGbn2: ''
      },
    });
  },
@@ -182,9 +134,30 @@ export default {
  },

  methods: {
-    save(){
-      alert("저장!")
-    }
+    fnSaveTxt(){
+      let params = {
+        startDate : this.startDate,
+        startTime : this.startTime,
+        endTime : this.endTime,
+        state : this.state,
+      }
+      sysMgtApi.setWorkState(params);
+
+    },
+    search: function (isKeep) {
+      this.$refs.table.search(this.grid.params, isKeep);
+    },
+
+    customFormatter: function (date) {
+      if (this.sDateDiv == 'month') {
+        return moment(date).format('YYYY-MM');
+      } else if (this.sDateDiv == 'year') {
+        return moment(date).format('YYYY');
+      } else {
+        return moment(date).format('YYYY-MM-DD');
+      }
+    },
+
  }
 };
 </script>