Merge branch 'morden-ui' of github.com:easysoft/zentaoatf into morden-ui

ui/src/layouts/MainLayout/components/Col.vue

@@ -41,7 +41,7 @@ const colClass = computed(() => {
 const colStyle = computed(() => {
   const style: Record<string, any> = {};
 
-  const width = typeof(props.width) === "undefined" ? '' : props.width
+  const width = typeof(props.width) === "undefined" ? '' : (props.width.indexOf('px') > 0 ? props.width : props.width + '%')
   const span = typeof(props.span) === "undefined" ? -1 : props.span
   const flex = typeof(props.flex) === "undefined" ? -1 : props.flex
 

ui/src/layouts/MainLayout/components/FormItem.vue

@@ -37,8 +37,8 @@ export interface FormItemProps {
 const props = defineProps<FormItemProps>();
 console.log(props)
 
-let labelCol = inject('labelCol');
-let wrapperCol = inject('wrapperCol');
+let labelCol = inject('labelCol') + '';
+let wrapperCol = inject('wrapperCol') + '';
 
 const size = ref(props.size)
 const errorMap = computed(() => {
@@ -67,7 +67,7 @@ const getWidth = (val: string) => {
     return val;
   }
 
-  return undefined;
+  return val;
 }
 const getCls = (val: string) => {
   if (!val) return undefined
@@ -97,10 +97,17 @@ const getCls = (val: string) => {
   }
   .z-form-item-wrapper {
     .z-form-item-control {
+      height: 100%;
       input, select {
+        width: 90%;
         height: 28px;
         vertical-align: middle;
       }
+      input[type="checkbox"] {
+        width: auto;
+        height: 14px;
+        margin-top: 6px;
+      }
       label {
         display: inline-block;
         padding: 0 3px;

ui/src/layouts/MainLayout/components/TabPage.vue

@@ -11,6 +11,7 @@ import TabPageResult from './TabPageResult.vue';
 import TabPageScript from './TabPageScript.vue';
 import TabPageSettings from './TabPageSettings.vue';
 import TabPageSites from './TabPageSites.vue';
+import TabPageExecUnit from './TabPageExecUnit.vue';
 import TabPageUnknown from './TabPageUnknown.vue';
 import {useI18n} from "vue-i18n";
 const { t } = useI18n();
@@ -20,6 +21,7 @@ const PageTabComponent = {
     settings: TabPageSettings,
     result: TabPageResult,
     sites: TabPageSites,
+  execUnit: TabPageExecUnit,
     unknown: TabPageUnknown,
 };
 

ui/src/layouts/MainLayout/components/TabPageExecUnit.vue

+<template>
+  <div class="tab-page-exec-unit">
+    <Form labelCol="180px" wrapperCol="60">
+      <FormItem name="cmd" :label="t('test_cmd')" :info="validateInfos.cmd">
+        <input v-model="modelRef.cmd" @keydown="keydown"/>
+      </FormItem>
+
+      <FormItem v-if="currProduct.id" name="submitResult" :label="t('submit_result_to_zentao')">
+        <input v-model="modelRef.submitResult" type="checkbox">
+      </FormItem>
+
+      <FormItem>
+        <a-button :disabled="isRunning === 'true' || !modelRef.cmd" @click="start" type="primary"
+                  class="t-btn-gap">
+          {{ t('exec') }}
+        </a-button>
+        <a-button v-if="isRunning === 'true'" @click="stop" class="t-btn-gap">
+          {{ t('stop') }}
+        </a-button>
+      </FormItem>
+
+      <FormItem>
+        <span class="t-tips">{{ t('cmd_nav') }}</span>
+      </FormItem>
+    </Form>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {withDefaults, defineProps, computed, ref, watch} from "vue";
+import { PageTab } from "@/store/tabs";
+import {useI18n} from "vue-i18n";
+import {useStore} from "vuex";
+import {ZentaoData} from "@/store/zentao";
+import {useForm} from "@/utils/form";
+const { t } = useI18n();
+
+import Form from "./Form.vue";
+import FormItem from "./FormItem.vue";
+import {get} from "@/views/workspace/service";
+import {ScriptData} from "@/views/script/store";
+import {getCmdHistories, setCmdHistories} from "@/utils/cache";
+import {WorkspaceData} from "@/store/workspace";
+import bus from "@/utils/eventBus";
+import settings from "@/config/settings";
+
+const props = withDefaults(defineProps<{
+  tab: PageTab
+}>(), {})
+
+const zentaoStore = useStore<{ Zentao: ZentaoData }>();
+const currProduct = computed<any>(() => zentaoStore.state.Zentao.currProduct);
+
+const scriptStore = useStore<{ Script: ScriptData }>();
+const currWorkspace = computed<any>(() => scriptStore.state.Script.currWorkspace);
+
+const workspaceId = computed<any>(() => props.tab.data.workspaceId)
+const workspaceType = computed<any>(() => props.tab.data.workspaceType)
+
+const modelRef = ref({} as any)
+const isRunning = ref(false)
+
+const histories = ref([] as any[])
+const historyIndex = ref(0)
+
+const rulesRef = ref({
+  cmd: [
+    {required: true, msg: 'Please input test command.'},
+  ],
+})
+const {validate, reset, validateInfos} = useForm(modelRef, rulesRef);
+
+const loadWorkspaceCmd = async () => {
+  get(currWorkspace.value.id).then((json) => {
+    modelRef.value = Object.assign({cmd: json.data.cmd}, currWorkspace.value)
+  })
+}
+
+const loadCmdHistories = async () => {
+  histories.value = await getCmdHistories(currWorkspace.value.id)
+  historyIndex.value = histories.value? histories.value.length : 0
+}
+
+watch(currWorkspace, () => {
+  console.log('watch currWorkspace', currWorkspace)
+
+  loadCmdHistories()
+  loadWorkspaceCmd()
+}, {deep: true})
+
+if (workspaceId.value > 0 && workspaceId.value !== currWorkspace.value.id) {
+  scriptStore.dispatch('Script/changeWorkspace',
+      {id: workspaceId.value, type: workspaceType.value})
+}
+
+const start = () => {
+  console.log('start exec unit test', modelRef.value)
+
+  addHistory()
+
+  const data = Object.assign({execType: 'unit'}, modelRef.value)
+  bus.emit(settings.eventExec, data);
+}
+
+const stop = () => {
+  console.log('stop')
+}
+
+const addHistory = () => {
+  if (modelRef.value.cmd !== histories.value[histories.value.length - 1])
+    histories.value.push(modelRef.value.cmd)
+  if (histories.value.length > 10)
+    histories.value = histories.value.slice(histories.value.length - 10)
+
+  setCmdHistories(currWorkspace.value.id, histories.value)
+  historyIndex.value = histories.value.length
+}
+const keydown = (e) => {
+  console.log('keydown', e.code)
+
+  if (e.code === 'ArrowUp') {
+    if (historyIndex.value > 0) historyIndex.value--
+    modelRef.value.cmd = histories.value[historyIndex.value]
+  } else if (e.code === 'ArrowDown') {
+    if (historyIndex.value < histories.value.length - 1) historyIndex.value++
+    modelRef.value.cmd = histories.value[historyIndex.value]
+  }
+}
+
+console.log(workspaceId, workspaceType)
+
+</script>
+
+<style lang="less" scoped>
+.tab-page-exec-unit {
+  padding: 16px;
+}
+</style>

ui/src/layouts/MainLayout/components/WorkDir.vue

@@ -80,6 +80,7 @@ import {ExecStatus} from "@/store/exec";
 import debounce from "lodash.debounce";
 import throttle from "lodash.debounce";
 import {isInArray} from "@/utils/array";
+import {PageType} from "@/store/tabs";
 
 const {t} = useI18n();
 
@@ -141,7 +142,18 @@ const onToolbarClicked = (e) => {
 }
 
 const runTest = (node) => {
-  console.log(node)
+  console.log('runTest', node.value)
+
+  store.dispatch('tabs/open', {
+    id: 'workspace-' + node.value.workspaceId,
+    title: node.value.title,
+    type: 'execUnit',
+    changed: false,
+    data: {
+      workspaceId: node.value.workspaceId,
+      workspaceType: node.value.workspaceType,
+    }
+  });
 }
 
 const modalClose = () => {

ui/src/services/workspace.ts

@@ -2,7 +2,7 @@ import request from '@/utils/request';
 
 const apiPath = 'workspaces';
 
-export async function queryWorkspace(currWorkspacePath: string): Promise<any> {
+export async function getWorkspace(currWorkspacePath: string): Promise<any> {
     const params = {currWorkspace: currWorkspacePath}
 
     return request({

ui/src/store/tabs.ts

@@ -5,7 +5,7 @@ import { StoreModuleType } from "@/utils/store";
  * Page type（Test script, Test result, settings and sites）
  * 标签页页面类型（测试脚步代码、测试结果、设置、站点管理）
  */
-export type PageType = 'script' | 'result' | 'settings' | 'sites';
+export type PageType = 'script' | 'result' | 'settings' | 'sites' | 'execUnit';
 
 /**
  * Single page tab

ui/src/store/workspace.ts

 import { Mutation, Action } from 'vuex';
 import { StoreModuleType } from "@/utils/store";
 import { ResponseData } from '@/utils/request';
-import {queryWorkspace, deleteWorkspace} from "@/services/workspace";
+import {deleteWorkspace, getWorkspace} from "@/services/workspace";
 import {setCache} from "@/utils/localCache";
 import settings from '@/config/settings';
 
@@ -32,7 +32,7 @@ const initState: WorkspaceData = {
 
 const StoreModel: ModuleType = {
   namespaced: true,
-  name: 'workspace',
+  name: 'Workspace',
   state: {
     ...initState
   },
@@ -51,7 +51,7 @@ const StoreModel: ModuleType = {
   actions: {
     async fetchWorkspace({ commit }, currWorkspacePath) {
       try {
-        const response: ResponseData = await queryWorkspace(currWorkspacePath);
+        const response: ResponseData = await getWorkspace(currWorkspacePath);
         const { data } = response;
         commit('saveWorkspaces', data || {});
 
@@ -64,7 +64,7 @@ const StoreModel: ModuleType = {
       try {
         await deleteWorkspace(selectedWorkspacePath);
 
-        const response: ResponseData = await queryWorkspace('');
+        const response: ResponseData = await getWorkspace('');
         const { data } = response;
         commit('saveWorkspaces', data || {});