@k3000/s1 0.1.0

package/files/pm2Data.vue

@@ -0,0 +1,335 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
+      <el-form-item label="方法" prop="method">
+        <el-input v-model="queryParams.method"/>
+      </el-form-item>
+      <el-form-item label="备注" prop="remark">
+        <el-input v-model="queryParams.remark"/>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+            type="primary"
+            plain
+            icon="Plus"
+            @click="handleAdd"
+            v-hasPermi="['system:service:add']"
+        >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+            type="success"
+            plain
+            icon="Edit"
+            :disabled="single"
+            @click="handleUpdate"
+            v-hasPermi="['system:service:edit']"
+        >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+            type="danger"
+            plain
+            icon="Delete"
+            :disabled="multiple"
+            @click="handleDelete"
+            v-hasPermi="['system:service:remove']"
+        >删除
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+            type="warning"
+            plain
+            icon="Download"
+            @click="handleExport"
+            v-hasPermi="['system:service:export']"
+        >导出
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+            type="warning"
+            plain
+            icon="Close"
+            @click="handleClose"
+        >关闭
+        </el-button>
+      </el-col>
+      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center"/>
+      <el-table-column label="方法" align="center" prop="method"/>
+      <el-table-column label="备注">
+        <template #default="scope"><pre>{{getRemark(scope.row.remark)}}</pre></template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
+        <template #default="scope">
+          <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
+                     v-hasPermi="['system:service:edit']">
+            修改
+          </el-button>
+          <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
+                     v-hasPermi="['system:service:remove']">删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+        v-show="total > 0"
+        :total="total"
+        v-model:page="queryParams.pageNum"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
+    />
+
+    <!-- 添加或修改参数配置对话框 -->
+    <el-dialog :title="title" v-model="open" width="666px" append-to-body>
+      <el-form ref="dataRef" :model="form" :rules="rules" label-width="120px">
+        <el-form-item label="方法" prop="method">
+          <el-input v-model="form.method"/>
+        </el-form-item>
+        <el-form-item label="参数类型">
+          <el-input v-model="paramClass" :rows="4" type="textarea"/>
+        </el-form-item>
+        <el-form-item label="返回值类型">
+          <el-input v-model="returnClass" :rows="4" type="textarea"/>
+        </el-form-item>
+        <el-form-item label="备注">
+          <el-input v-model="remark" :rows="4" type="textarea"/>
+        </el-form-item>
+      </el-form>
+      <div class="pre">{{code}}</div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="ServiceData">
+import {listData, updateData, addData, delData} from "@/api/tool/pm2.js";
+
+const {proxy} = getCurrentInstance();
+
+const dataList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const route = useRoute();
+
+const Name = route.params.name[0].toUpperCase() + route.params.name.substring(1)
+const paramClass = ref('');
+const returnClass = ref('');
+const remark = ref('')
+
+const getRemark = remark => {
+  const index1 = remark.indexOf('***')
+  const index2 = remark.indexOf('***', index1 + 3)
+  return  remark.substring(index2 + 4)
+}
+
+const code = computed(() => {
+  if (!form.value.method) return
+  let code = ''
+  const name = form.value.method[0].toUpperCase() + form.value.method.substring(1)
+  if (paramClass.value && paramClass.value.includes(':')) {
+    code += `
+interface ${Name}${name}Param {
+    ${paramClass.value.replace(/\n/g, '\n    ')}
+}
+`
+  }
+  if (returnClass.value && returnClass.value.includes(':')) {
+    code += `
+interface ${Name}${name}Return {
+    ${returnClass.value.replace(/\n/g, '\n    ')}
+}
+`
+  }
+  return `
+  ${code}
+export interface Service {
+    ...
+    ${route.params.name}: {
+        ...${remark.value ? `
+        /**
+         * ${remark.value.replace(/\n/g, '\n         * ')}
+         */` : ''}
+        ${form.value.method}(${paramClass.value ? paramClass.value.includes(':') ? `_: ${Name}${name}Param` : `_: ${paramClass.value}` : ''
+  }): Promise${returnClass.value ? returnClass.value.includes(':') ? `<${Name}${name}Return>` : `<${returnClass.value}>` : '<any>'}
+        ...
+    }
+    ...
+}
+  `
+})
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    method: undefined,
+    remark: undefined,
+  },
+  rules: {
+    method: [{required: true, message: "名称不能为空", trigger: "blur"}],
+  }
+});
+
+const {queryParams, form, rules} = toRefs(data);
+
+/** 查询字典数据列表 */
+function getList() {
+  loading.value = true;
+  listData({name: route.params.name, ...queryParams.value}).then(response => {
+    dataList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    method: undefined,
+    remark: undefined,
+  };
+  paramClass.value = ''
+  returnClass.value = ''
+  remark.value = ''
+  proxy.resetForm("dataRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 返回按钮操作 */
+function handleClose() {
+  const obj = {path: "/tool/pm2"};
+  proxy.$tab.closeOpenPage(obj);
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加数据";
+}
+
+/** 多选框选中数据 */
+function handleSelectionChange(selection) {
+  ids.value = selection.map(item => item.id);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  form.value = row;
+  open.value = true;
+  title.value = "修改数据";
+  const index1 = row.remark.indexOf('***')
+  const index2 = row.remark.indexOf('***', index1 + 3)
+  paramClass.value = row.remark.substring(1, index1 - 1).replace(/\n /g, '\n')
+  returnClass.value = row.remark.substring(index1 + 5, index2 - 1).replace(/\n /g, '\n')
+  remark.value = row.remark.substring(index2 + 4)
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["dataRef"].validate(valid => {
+    if (valid) {
+      form.value.remark = ` ${paramClass.value.replace(/\n/g, '\n ')}
+***
+ ${returnClass.value.replace(/\n/g, '\n ')}
+***
+${remark.value}`
+      console.log(form.value.remark.length)
+      if (form.value.id != undefined) {
+        updateData({name: route.params.name, ...form.value}).then(response => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addData({name: route.params.name, ...form.value}).then(response => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(rows) {
+  const id = rows.id || ids.value;
+  proxy.$modal.confirm('是否确认删除编码为"' + id + '"的数据项？').then(function () {
+    return delData(id);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {
+  });
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download("system/dict/data/export", {
+    ...queryParams.value
+  }, `dict_data_${new Date().getTime()}.xlsx`);
+}
+
+getList()
+</script>
+
+<style scoped>
+.pre {
+  background: dimgray;
+  border-radius: 6px;
+  padding: 0 12px;
+  color: white;
+  font-family: "Courier New", cursive;
+  white-space: pre-wrap;
+  font-size: 1.2em;
+}
+</style>

package/files/pm2Index.vue

@@ -0,0 +1,343 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="名称" prop="name">
+        <el-input
+            v-model="queryParams.name"
+            placeholder="请输入名称"
+            clearable
+            style="width: 240px"
+            @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+            type="primary"
+            plain
+            icon="Plus"
+            @click="handleAdd"
+            v-hasPermi="['system:store:add']"
+        >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+            type="primary"
+            plain
+            icon="Upload"
+            @click="save"
+        >保存
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+            type="primary"
+            plain
+            icon="Refresh"
+            @click="resurrect"
+        >重新加载
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+            type="success"
+            plain
+            icon="Download"
+            @click="exportMjs"
+        >导出
+        </el-button>
+      </el-col>
+      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="typeList">
+      <el-table-column label="id" align="center" prop="id" :show-overflow-tooltip="true"/>
+      <el-table-column label="名称" align="center" prop="name" :show-overflow-tooltip="true">
+        <template #default="scope">
+          <router-link v-if="scope.row.type === 1" :to="'/tool/service-data/' + scope.row.name" class="link-type">
+            <span>{{ scope.row.name }}</span>
+          </router-link>
+          <span v-else>{{ scope.row.name }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="命名空间" align="center" prop="namespace" :show-overflow-tooltip="true"/>
+      <el-table-column label="pid" align="center" prop="pid" :show-overflow-tooltip="true"/>
+      <el-table-column label="状态" align="center" width="100">
+        <template #default="scope">
+          <el-switch
+              v-model="scope.row.status"
+              :active-value="0"
+              :inactive-value="1"
+              @change="handleStatusChange(scope.row)"
+          ></el-switch>
+        </template>
+      </el-table-column>
+      <el-table-column label="cpu" align="center" prop="cpu" :show-overflow-tooltip="true"/>
+      <el-table-column label="模式" align="center" prop="mode" :show-overflow-tooltip="true"/>
+      <el-table-column label="监听" align="center" prop="watching" :show-overflow-tooltip="true"/>
+      <el-table-column label="UDP/TCP服务" align="center" :show-overflow-tooltip="true">
+        <template #default="scope">{{ scope.row.type === 1 ? '是' : '否' }}</template>
+      </el-table-column>
+      <el-table-column label="host" align="center" :show-overflow-tooltip="true">
+        <template #default="scope">{{ scope.row.type === 1 ? scope.row.host : undefined }}</template>
+      </el-table-column>
+      <el-table-column label="port" align="center" :show-overflow-tooltip="true">
+        <template #default="scope">{{ scope.row.type === 1 ? scope.row.port : undefined }}</template>
+      </el-table-column>
+      <el-table-column label="备注" prop="remark" :show-overflow-tooltip="true"/>
+      <el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
+        <template #default="scope">
+          <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
+                     v-hasPermi="['system:store:remove']">删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+        v-show="total > 0"
+        :total="total"
+        v-model:page="queryParams.pageNum"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
+    />
+
+    <!-- 添加或修改参数配置对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="serviceRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="名称" prop="name">
+          <el-input v-model="form.name" placeholder="请输入名称"/>
+        </el-form-item>
+        <el-form-item label="类型" prop="type">
+          <el-radio-group v-model="form.type" class="ml-4">
+            <el-radio :value="0" size="large">普通</el-radio>
+            <el-radio :value="1" size="large">UDP/TCP</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="前置参数" prop="arg1">
+          <el-input v-model="form.arg1" placeholder="请名称"/>
+        </el-form-item>
+        <el-form-item v-if="form.type === 1" label="域名/IP" prop="host">
+          <el-input v-model="form.host" placeholder="请输入"/>
+        </el-form-item>
+        <el-form-item v-if="form.type === 1" label="端口" prop="port">
+          <el-input-number v-model="form.port" placeholder="请输入"/>
+        </el-form-item>
+        <el-form-item label="脚本路径" prop="arg1">
+          <el-select v-model="form.path" filterable clearable placeholder="请输入脚本路径">
+            <el-option
+                v-for="path in pathList"
+                :key="path"
+                :label="path"
+                :value="path"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="后置参数" prop="arg2">
+          <el-input v-model="form.arg2" placeholder="请名称"/>
+        </el-form-item>
+        <el-form-item label="状态" prop="status">
+          <el-select v-model="form.status" size="large">
+            <el-option label="启用" :value="0"/>
+            <el-option label="停用" :value="1"/>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" autosize type="textarea"/>
+        </el-form-item>
+        <div class="code">> pm2 start {{ form.arg1 }} {{ form.path ? form.path + '.mjs' : '' }} {{ form.arg2 }}
+          --name="{{ form.name }}"
+        </div>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup name="Pm2">
+import {
+  addPm2,
+  delPm2,
+  listPath,
+  listPm2,
+  handleStatusChange as changeSrvStatus,
+  handleSave,
+  handleResurrect,
+} from "@/api/tool/pm2.js";
+
+const {proxy} = getCurrentInstance();
+
+const typeList = ref([]);
+const pathList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    name: undefined,
+    type: undefined,
+    host: undefined,
+    status: undefined,
+    remark: undefined,
+  },
+  rules: {
+    name: [{required: true, message: "名称不能为空", trigger: "blur"}],
+    host: [{required: true, message: "不能为空", trigger: "blur"}],
+    port: [{required: true, message: "不能为空", trigger: "blur"}],
+  },
+});
+
+const {queryParams, form, rules} = toRefs(data);
+
+function getPathList() {
+
+  listPath().then(response => {
+
+    pathList.value = response.data
+  });
+}
+
+/** 查询存储列表 */
+function getList() {
+  loading.value = true;
+  listPm2(queryParams.value).then(response => {
+    typeList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/** 取消按钮 */
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+/** 表单重置 */
+function reset() {
+  form.value = {
+    name: undefined,
+    type: 0,
+    host: 'localhost',
+    port: undefined,
+    arg1: undefined,
+    arg2: undefined,
+    path: undefined,
+    status: 0,
+    remark: undefined,
+  };
+  proxy.resetForm("serviceRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  getPathList()
+  open.value = true;
+  title.value = "添加服务";
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["serviceRef"].validate(valid => {
+    if (valid) {
+      addPm2(form.value).then(response => {
+        proxy.$modal.msgSuccess("新增成功");
+        open.value = false;
+        getList();
+      });
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const name = row.name;
+  proxy.$modal.confirm('是否确认删除编号为"' + name + '"的数据项？').then(function () {
+    return delPm2(name);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {
+  });
+}
+
+function handleStatusChange(row) {
+  let text = row.status === 0 ? "启用" : "停用";
+  proxy.$modal.confirm('确认要"' + text + '""' + row.name + '"服务吗?').then(function () {
+    return changeSrvStatus(row.name, row.status);
+  }).then(() => {
+    getList()
+    proxy.$modal.msgSuccess(text + "成功");
+  }).catch(function () {
+    row.status = row.status === "stopped" ? "online" : "stopped";
+  });
+}
+
+function save() {
+
+  handleSave().then(() => {
+    getList();
+    proxy.$modal.msgSuccess("保存成功");
+  }).catch(() => {
+  });
+}
+
+function resurrect() {
+
+  handleResurrect().then(() => {
+    getList();
+    proxy.$modal.msgSuccess("加载成功");
+  }).catch(() => {
+  });
+}
+
+const exportMjs = () => {
+
+  proxy.$download.zip("/tool/pm2/data/export", "service.zip");
+}
+
+getList();
+</script>
+
+<style scoped lang="scss">
+.code {
+  background: dimgray;
+  border-radius: 6px;
+  padding: 10px 12px;
+  color: white;
+  font-family: "Courier New", cursive;
+}
+</style>