10.22

electron-builder.yml

@@ -1,5 +1,5 @@
 appId: com.electron.lichong
-productName: 桌面应用
+productName: 处方记录
 directories:
   buildResources: build
 files:
@@ -14,7 +14,7 @@ win:
   executableName: lichong-app
 nsis:
   oneClick: false
-  artifactName: 处方统计-${version}-setup.${ext}
+  artifactName: 处方记录-${version}-setup.${ext}
   allowToChangeInstallationDirectory: true
   shortcutName: ${productName}
   uninstallDisplayName: ${productName}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "electron",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "An Electron application with Vue",
   "main": "./out/main/index.js",
   "author": "lichong",
@@ -16,6 +16,7 @@
   "dependencies": {
     "@electron-toolkit/preload": "^1.0.2",
     "@electron-toolkit/utils": "^1.0.2",
+    "@reiyanyan/vue-camera": "^1.3.1",
     "dayjs": "^1.11.11",
     "dexie": "^4.0.8",
     "element-plus": "^2.7.1",
@@ -35,4 +36,4 @@
     "vite": "^3.1.8",
     "vue": "^3.2.41"
   }
-}
+}

src/main/index.js

@@ -1,4 +1,4 @@
-import { app, shell, BrowserWindow, nativeImage, ipcMain } from 'electron'
+import { app, shell, BrowserWindow, nativeImage } from 'electron'
 import * as path from 'path'
 import { electronApp, optimizer, is } from '@electron-toolkit/utils'
 
@@ -16,7 +16,9 @@ function createWindow() {
     icon: logoIcon,
     webPreferences: {
       preload: path.resolve(__dirname, '../preload/index.js'),
-      sandbox: false
+      sandbox: false,
+      nodeIntegration: true,
+      contextIsolation: false
     }
   })
   mainWindow.on('ready-to-show', () => {

src/renderer/src/assets/json/chufang.json

@@ -29,14 +29,14 @@
     "type": "date",
     "isSort": true,
     "tableShow": true,
-    "formShow": false
+    "formShow": true
   },
   {
     "label": "更新时间",
     "prop": "update_at",
     "type": "date",
-    "isSort": false,
-    "tableShow": false,
-    "formShow": false
+    "isSort": true,
+    "tableShow": true,
+    "formShow": true
   }
 ]

src/renderer/src/components/formcomponent.vue

@@ -1,24 +1,50 @@
 <template>
   <div class="tableClass">
-    <el-form :model="formData" label-suffix="：" :disabled="disabled" inline>
-      <el-form-item :label="formItem.label" :key="formIndex" v-for="(formItem, formIndex) in formHeader">
-        <template v-if="formItem.type === 'text'">
-          <el-input v-model="formData[formItem.prop]" />
-        </template>
-        <template v-else-if="formItem.type === 'date'">
-          <el-date-picker v-model="formData[formItem.prop]" type="date"
-            :disabled="['create_at', 'update_at'].indexOf(formItem.prop) !== -1"
-            :placeholder="`请选择${formItem.label}`" />
-        </template>
-        <template v-else-if="formItem.type === 'photo'">
-          <div class="camera-capture">
-            <video :ref="`${formItem.prop}vedio`" autoplay playsinline></video>
-            <button @click="takePhoto(formItem)">拍照</button>
-            <canvas :ref="`${formItem.prop}canvas`" style="display: none;"></canvas>
-            <img v-if="formData[formItem.prop]" :src="formData[formItem.prop]" alt="Captured Photo" />
-          </div>
-        </template>
-      </el-form-item>
+    <el-form :model="formData" label-suffix="：" :disabled="disabled" inline @submit.prevent>
+      <el-row>
+        <el-col :key="formIndex" v-for="(formItem, formIndex) in formHeader"
+          :span="['text', 'date'].includes(formItem.type) ? 24 : 12">
+          <el-form-item :label="formItem.label">
+            <template v-if="formItem.type === 'text'">
+              <el-input v-model="formData[formItem.prop]" />
+            </template>
+            <template v-else-if="formItem.type === 'date'">
+              <el-date-picker v-model="formData[formItem.prop]" type="date"
+                :disabled="['create_at', 'update_at'].indexOf(formItem.prop) !== -1"
+                :placeholder="`请选择${formItem.label}`" />
+            </template>
+            <template v-else-if="formItem.type === 'photo'">
+              <div v-if="!disabled">
+                <el-row>
+                  <el-col :span="12">
+                    <button @click="openVedio(formItem)">打开视频</button>
+                  </el-col>
+                  <el-col :span="12">
+                    <button @click="takePhoto(formItem)">拍照</button>
+                  </el-col>
+                </el-row>
+                <el-row>
+                  <el-col :span="12">
+                    <video :ref="`${formItem.prop}video`" style="width: 200px;height: 200px;border: 1px solid #ccc;"
+                      autoplay playsinline v-show="!formData[formItem.prop]"></video>
+                    <canvas :ref="`${formItem.prop}canvas`" width="202" height="202" style="display: none;"></canvas>
+                    <img v-if="formData[formItem.prop]" :src="formData[formItem.prop]" alt="Captured Photo" />
+                  </el-col>
+                </el-row>
+              </div>
+              <div v-else>
+                <el-row>
+                  <el-col :span="12">
+                    <el-image style="width: 100px; height: 100px" :src="formData[formItem.prop]" :zoom-rate="1.2"
+                      :max-scale="7" :min-scale="0.2" :preview-src-list="[formData[formItem.prop]]" :initial-index="4"
+                      fit="cover" />
+                  </el-col>
+                </el-row>
+              </div>
+            </template>
+          </el-form-item>
+        </el-col>
+      </el-row>
     </el-form>
   </div>
 </template>
@@ -55,10 +81,28 @@ export default {
     return {
       _: _,
       dayjs: dayjs,
+    }
+  },
+  methods: {
+    async openVedio(formItem) {
+      this.formData[formItem.prop] = ""
+      let stream = await navigator.mediaDevices.getUserMedia({
+        video: {
+          width: { ideal: 200 },
+          height: { ideal: 200 }
+        },
 
+      });
+      this.$refs[`${formItem.prop}video`][0].srcObject = stream;
+    },
+    takePhoto(formItem) {
+      let video = this.$refs[`${formItem.prop}video`][0]
+      let canvas = this.$refs[`${formItem.prop}canvas`][0]
+      let context = canvas.getContext('2d');
+      context.drawImage(video, 0, 0, 202, 202);
+      this.formData[formItem.prop] = canvas.toDataURL('image/png');
     }
   },
-  methods: {},
   async mounted() { },
   watch: {},
   computed: {}

src/renderer/src/components/tablecomponent.vue

@@ -6,7 +6,7 @@
           :checkbox-config="{ labelField: 'seq', highlight: true }" @checkbox-all="selectAllChangeEvent"
           @checkbox-change="selectChange" ref="tableRef" border :column-config="{ resizable: true }">
           <vxe-column type="seq" width="70"></vxe-column>
-          <vxe-column type="checkbox" width="70" fixed="left"></vxe-column>
+          <vxe-column type="checkbox" width="60"></vxe-column>
           <vxe-column :field="headerItem.prop" :title="headerItem.label"
             :min-width="`${headerItem.label.length * 23 + 24}`" v-for="(headerItem, headerIndex) in tableHeader"
             :key="headerIndex" :sortable="headerItem.isSort">
@@ -15,17 +15,19 @@
                 <span>{{ row[headerItem.prop] }}</span>
               </template>
               <template v-else-if="headerItem.type === 'date'">
-                <span>{{ row[headerItem.prop] }}</span>
+                <span>{{ dayjs(row[headerItem.prop]).format("YYYY-MM-DD HH:mm:ss") }}</span>
               </template>
               <template v-else-if="headerItem.type === 'photo'">
-                <el-image style="width: 100px; height: 100px" :src="row[headerItem.prop]" :zoom-rate="1.2"
-                  :max-scale="7" :min-scale="0.2" :preview-src-list="[row[headerItem.prop]]" :initial-index="4"
-                  fit="cover" />
-                {{ row[headerItem.prop] }}</template>
+                <span v-if="row[headerItem.prop]">
+                  <el-image style="width: 45px" :src="row[headerItem.prop]" :zoom-rate="1.2" :max-scale="7"
+                    :min-scale="0.2" :preview-src-list="[row[headerItem.prop]]" :initial-index="4" fit="cover" />
+                </span>
+                <span v-else>无</span>
+              </template>
               <template v-else>{{ row[headerItem.prop] }}</template>
             </template>
           </vxe-column>
-          <vxe-column fixed="right" title="操作" width="145">
+          <vxe-column title="操作" width="145">
             <template #default="{ row }">
               <el-button type="primary" circle @click="optClick(row, 'edit')">
                 <el-icon>
@@ -80,6 +82,12 @@ export default {
     }
   },
   methods: {
+    clearSelection() {
+      const $table = this.$refs.tableRef
+      if ($table) {
+        $table.clearCheckboxRow()
+      }
+    },
     selectChange({ checked }) {
       let $table = this.$refs.tableRef
       if ($table) {

src/renderer/src/views/chufang.vue

@@ -24,7 +24,7 @@
           </el-button>
         </el-col>
         <el-col :span="6">
-          <el-input v-model="searchParams.xingming" placeholder="请输入输入姓名" size="large">
+          <el-input v-model="searchParams.xingming" placeholder="请输入输入姓名" size="large" clearable>
             <template #append>
               <el-button type="primary" @click="updateSeach()" size="large">
                 <el-icon>
@@ -136,18 +136,7 @@ export default {
     },
     //确认模态框
     async submitDialog() {
-      for (let i = 0; i < this.formHeader.length; i++) {
-        let headItem = this.formHeader[i];
-        if (headItem.type === "date") {
-          this.dialogFrom.formData[headItem.prop] = dayjs(this.dialogFrom.formData[headItem.prop]).format("YYYY-MM-DD")
-        }
-      }
-      let params = {
-        ...this.dialogFrom.formData, ...this.dealRow(this.dialogFrom.formData), create_at: dayjs().format('YYYY-MM-DD HH:mm:ss'), update_at: dayjs().format('YYYY-MM-DD HH:mm:ss')
-      }
-      if (this.dialogFrom.type === "put") {
-        delete params.create_at
-      }
+      let params = { ...this.dialogFrom.formData, }
       try {
         await myDatabase.chufang[this.dialogFrom.type]({ ...params, update_at: dayjs().format('YYYY-MM-DD HH:mm:ss') })
         await this.updateSeach()
@@ -169,7 +158,7 @@ export default {
         if (element.type === "text") {
           formData[element.prop] = ""
         } else if (element.type === "date") {
-          formData[element.prop] = dayjs().subtract(element.default || 0, 'year').format("YYYY-MM-DD")
+          formData[element.prop] = dayjs().valueOf()
         }
       }
       this.dialogFrom = {
@@ -230,7 +219,7 @@ export default {
           await myDatabase.chufang.bulkDelete(idList)
           await this.updateSeach()
         })
-        .catch(() => {
+        .catch((err) => {
           ElMessage({
             type: 'info',
             message: '取消删除',