更新 版本日志管理

src/components/Header.vue

@@ -8,7 +8,7 @@
         class="ml20"
         style="color: #fff; font-size: 18px; height: 60px; padding-top: 50px"
       >
-        version：{{ timelineData[0].version }}
+        version：{{ this.$store.state.versions[0]?.version }}
       </div>
     </div>
     <div class="right">
@@ -32,7 +32,7 @@
       <el-popover placement="bottom" trigger="hover" :width="240">
         <el-timeline>
           <el-timeline-item
-            v-for="item in timelineData"
+            v-for="item in this.$store.state.versions"
             center
             :timestamp="item.timer"
             placement="top"
@@ -43,7 +43,7 @@
                 style="margin-bottom: 5px; font-size: 12px"
                 v-for="(item1, index) in item.remarks"
               >
-                {{ index + 1 }}. {{ item1 }}
+                {{ index + 1 }}. {{ item1.text }}
               </div>
             </div>
           </el-timeline-item>
@@ -87,6 +87,10 @@ import api from "../apis/fetch";
 import { onMounted, ref } from "vue";
 import { BellFilled } from "@element-plus/icons";
 import _ from "lodash";
+import tcb from "../apis/cloudLogin";
+const db = tcb.database();
+const v = db.collection("huihenduo_versions");
+
 export default {
   components: {
     BellFilled,
@@ -155,6 +159,7 @@ export default {
           getUnphotographNotice();
         }
       }, 2 * 60 * 1000);
+      getVersions();
     });
 
     let vs = [
@@ -183,7 +188,7 @@ export default {
       },
       {
         version: "1.3.4.0	",
-        timer: "2022/2/25",
+        timer: "2022/2/28",
         remarks: [
           "发布汽车装货记录功能",
           "发布单据识别算法功能",
@@ -193,7 +198,20 @@ export default {
       },
     ];
     let timelineData = ref([]);
-    timelineData.value = vs.reverse();
+    // timelineData.value = vs.reverse();
+
+    async function getVersions() {
+      let res = await v
+        .where({ disabled: false })
+        .limit(10)
+        .field({
+          _id: false,
+          _openid: false,
+        })
+        .get();
+      console.log(res);
+      timelineData.value = res.data.reverse();
+    }
 
     const size = 20;
     return {

src/store/index.js

@@ -14,6 +14,7 @@ const store = createStore({
     baseurl,
     uploadUrl,
     wayBillUrl,
+    versions: [],
   },
   mutations: {
     changefirstTitle(state, text) {
@@ -28,6 +29,9 @@ const store = createStore({
     setCurrentMenuItem(state, index) {
       state.currentMenuItem = index;
     },
+    setVersions(state, data) {
+      state.versions = data;
+    },
   },
 });
 

src/views/index/Versions.vue

@@ -1,139 +1,166 @@
 <template>
-  <el-button type="primary" class="mb20" @click="isModalVisable = true"
-    >添加版本记录</el-button
-  >
-  <el-popover placement="bottom" trigger="hover" :width="240">
-    <el-timeline>
-      <el-timeline-item
-        v-for="item in versions"
-        center
-        :timestamp="item.timer"
-        placement="top"
-      >
-        <div class="log-card">
-          <p style="margin-bottom: 10px">Version: {{ item.version }}</p>
-          <div
-            style="margin-bottom: 5px; font-size: 12px"
-            v-for="(item1, index) in item.remarks"
-          >
-            {{ index + 1 }}. {{ item1.text }}
+  <div class="mt10">
+    <el-button type="primary" class="mb20 mr30" @click="isModalVisable = true"
+      >添加版本记录</el-button
+    >
+    <el-popover placement="bottom" trigger="hover" :width="240">
+      <el-timeline>
+        <el-timeline-item
+          v-for="item in this.$store.state.versions"
+          center
+          :timestamp="item.timer"
+          placement="top"
+        >
+          <div class="log-card">
+            <p style="margin-bottom: 10px">Version: {{ item.version }}</p>
+            <div
+              style="margin-bottom: 5px; font-size: 12px"
+              v-for="(item1, index) in item.remarks"
+            >
+              {{ index + 1 }}. {{ item1.text }}
+            </div>
           </div>
-        </div>
-      </el-timeline-item>
-    </el-timeline>
-    <template #reference>
-      <el-badge value="new">
-        <div class="log">新功能日志</div>
-      </el-badge>
-    </template>
-  </el-popover>
-  <el-dialog
-    title="版本管理"
-    width="500px"
-    v-model="isModalVisable"
-    @closed="cancel"
-  >
-    <el-form
-      ref="ruleFormRef"
-      :model="ruleForm"
-      :rules="rules"
-      class="demo-ruleForm"
-      :size="formSize"
-      label-width="100px"
-      label-position="left"
+        </el-timeline-item>
+      </el-timeline>
+      <template #reference>
+        <el-badge value="new">
+          <!-- <div class="log">新功能日志</div> -->
+          <el-button> 新功能日志</el-button>
+        </el-badge>
+      </template>
+    </el-popover>
+    <el-dialog
+      title="版本管理"
+      width="500px"
+      v-model="isModalVisable"
+      @closed="cancel"
     >
-      <el-form-item label="版本号" prop="version">
-        <el-input style="width: 240px" v-model="ruleForm.version"></el-input>
-      </el-form-item>
-      <el-form-item label="发布时间" prop="timer">
-        <el-input style="width: 240px" v-model="ruleForm.timer"></el-input>
-      </el-form-item>
-      <hr class="mb20" />
-      <el-form-item
-        v-for="(item, index) in ruleForm.remarks"
-        :label="'发布内容 ' + parseInt(index + 1) + ' :'"
-        prop="remarks"
+      <el-form
+        ref="ruleFormRef"
+        :model="ruleForm"
+        :rules="rules"
+        class="demo-ruleForm"
+        label-width="100px"
+        label-position="left"
       >
-        <div class="df aic jcsb">
-          <el-input
-            type="textarea"
+        <el-form-item label="版本号" prop="version">
+          <el-input style="width: 240px" v-model="ruleForm.version"></el-input>
+        </el-form-item>
+        <el-form-item label="发布时间" prop="timer">
+          <el-date-picker
             style="width: 240px"
-            v-model="item.text"
-            autosize
-          ></el-input>
-          <el-button size="small" type="danger">删除</el-button>
-        </div>
-      </el-form-item>
-      <div class="df aic jcfe">
-        <el-button
-          size="small"
-          type="primary"
-          @click="ruleForm.remarks.push({})"
-          >添加一条记录</el-button
-        >
-      </div>
-      <hr class="mt20 mb20" />
-      <div class="df aic jcfe">
-        <el-button @click="cancel(ruleFormRef)">取消</el-button>
-        <el-button type="primary" @click="add(ruleFormRef)">提交</el-button>
-      </div>
-    </el-form>
-  </el-dialog>
-  <el-table :data="versions">
-    <el-table-column
-      type="index"
-      label="序号"
-      min-width="120"
-      align="center"
-    ></el-table-column>
-    <el-table-column
-      prop="version"
-      label="版本号"
-      min-width="100"
-      align="center"
-    ></el-table-column>
-    <el-table-column
-      prop="timer"
-      label="发布时间"
-      min-width="100"
-      align="center"
-    ></el-table-column>
-    <el-table-column label="版本内容" min-width="150" align="center">
-      <template v-slot="scope">
-        <div
-          style="width: 100%; text-align: left"
-          v-for="(item, index) in scope.row.remarks"
+            v-model="ruleForm.timer"
+            type="date"
+            placeholder="请选择日期"
+            format="YYYY/MM/DD"
+            value-format="YYYY/MM/DD"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <hr class="mb20" />
+        <el-form-item
+          v-for="(item, index) in ruleForm.remarks"
+          :label="'发布内容 ' + parseInt(index + 1) + ' :'"
+          prop="remarks"
         >
-          {{ index + 1 + ". " + item.text }}
+          <div class="df aic jcsb">
+            <el-input
+              type="textarea"
+              style="width: 240px"
+              v-model="item.text"
+              autosize
+            ></el-input>
+            <el-button size="small" @click="deleteRemark(index)" type="danger"
+              >删除</el-button
+            >
+          </div>
+        </el-form-item>
+        <div class="df aic jcfe">
+          <el-button
+            size="small"
+            type="primary"
+            @click="ruleForm.remarks.push({})"
+            >添加一条记录</el-button
+          >
         </div>
-      </template>
-    </el-table-column>
-    <el-table-column label="操作" min-width="150" align="center">
-      <template v-slot="scope">
-        <el-button
-          @click="detail(scope.row, scope.$index)"
-          type="primary"
-          size="small"
-        >
-          修改
-        </el-button>
-        <el-button
-          @click="deleteItem(scope.row._id, scope.$index)"
-          type="danger"
-          size="small"
-        >
-          删除
-        </el-button>
-      </template>
-    </el-table-column>
-  </el-table>
+        <hr class="mt20 mb20" />
+        <div class="df aic jcfe">
+          <el-button @click="cancel(ruleFormRef)">取消</el-button>
+          <el-button type="primary" @click="add(ruleFormRef)">提交</el-button>
+        </div>
+      </el-form>
+    </el-dialog>
+    <el-table :data="versions">
+      <el-table-column
+        type="index"
+        label="序号"
+        min-width="120"
+        align="center"
+      ></el-table-column>
+      <el-table-column
+        prop="version"
+        label="版本号"
+        min-width="100"
+        align="center"
+      ></el-table-column>
+      <el-table-column
+        prop="timer"
+        label="发布时间"
+        min-width="100"
+        align="center"
+      ></el-table-column>
+      <el-table-column label="版本内容" min-width="150" align="center">
+        <template v-slot="scope">
+          <div
+            style="width: 100%; text-align: left"
+            v-for="(item, index) in scope.row.remarks"
+          >
+            {{ index + 1 + ". " + item.text }}
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column label="状态" min-width="150" align="center">
+        <template v-slot="scope">
+          <el-switch
+            v-model="scope.row.disabled"
+            active-color="#13ce66"
+            :active-value="false"
+            :inactive-value="true"
+            inactive-color="#ff4949"
+            @change="changeSwitch($event, scope.row._id)"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" min-width="150" align="center">
+        <template v-slot="scope">
+          <el-button
+            @click="detail(scope.row, scope.$index)"
+            type="primary"
+            size="small"
+          >
+            修改
+          </el-button>
+          <el-button
+            @click="deleteItem(scope.row._id, scope.$index)"
+            type="danger"
+            size="small"
+          >
+            删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
 </template>
 
 <script setup>
 import tcb from "apis/cloudLogin";
 import _ from "lodash";
+import { ElMessage, ElMessageBox } from "element-plus";
+import store from "../../store";
 const db = tcb.database();
 const v = db.collection("huihenduo_versions");
+
 import { reactive, ref, onMounted } from "vue";
 let versions = ref([]);
 let isModalVisable = ref(false);
@@ -153,17 +180,43 @@ function detail(item1) {
 }
 
 async function deleteItem(_id) {
-  let res = await v.doc(_id).remove();
-  getVersions();
-  console.log(res);
+  ElMessageBox.confirm("确认删除保险单?", "Warning", {
+    confirmButtonText: "删除",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      let res = await v.doc(_id).remove();
+      getAllVersions();
+    })
+    .catch(() => {
+      ElMessage({
+        type: "info",
+        message: "取消删除",
+      });
+    });
 }
 
-async function update() {}
+async function changeSwitch(disabled, id) {
+  let res = await v.doc(id).update({
+    disabled,
+  });
+  getAllVersions();
+}
+
+function deleteRemark(index) {
+  ruleForm.value.remarks.splice(index, 1);
+}
 
 async function add() {
   ruleFormRef.value.validate(async (valid) => {
     if (valid) {
       let res;
+      for (let i in ruleForm.value.remarks) {
+        if (!ruleForm.value.remarks[i].text) {
+          ruleForm.value.remarks.splice(i, 1);
+        }
+      }
       if (currentVersionId.value) {
         res = await v.doc(currentVersionId.value).update({
           ...ruleForm.value,
@@ -172,11 +225,12 @@ async function add() {
       } else {
         res = await v.add({
           ...ruleForm.value,
+          disabled: false,
           createTime: db.serverDate(),
         });
       }
 
-      getVersions();
+      getAllVersions();
       cancel();
     } else {
       console.log("未提交", ruleForm.value);
@@ -184,12 +238,24 @@ async function add() {
   });
 }
 
-async function getVersions() {
+async function getAllVersions() {
+  let res = await v
+    .skip((currentPage.value - 1) * pageSize.value)
+    .limit(pageSize.value)
+    .get();
+  versions.value = res.data.reverse();
+  getAbledVersions();
+}
+
+let abledVersions = ref([]);
+async function getAbledVersions() {
   let res = await v
+    .where({ disabled: false })
     .skip((currentPage.value - 1) * pageSize.value)
     .limit(pageSize.value)
     .get();
-  versions.value = res.data;
+  abledVersions.value = res.data.reverse();
+  store.commit("setVersions", abledVersions.value);
 }
 
 function cancel() {
@@ -197,7 +263,7 @@ function cancel() {
   ruleForm.value = {
     version: "",
     timer: "",
-    remarks: [],
+    remarks: [{}, {}, {}],
   };
   currentVersionId.value = null;
 }
@@ -205,7 +271,7 @@ function cancel() {
 let ruleForm = ref({
   version: "",
   timer: "",
-  remarks: [],
+  remarks: [{}, {}, {}],
 });
 
 const rules = reactive({
@@ -226,9 +292,9 @@ const rules = reactive({
 });
 
 onMounted(() => {
-  getVersions();
+  getAllVersions();
 });
 </script>
 
-<style>
+<style scoped>
 </style>