add share to guest by web client

src/views/my/address_book/index.vue

@@ -29,9 +29,10 @@
         <el-table-column prop="tags" :label="T('Tags')" align="center"/>
         <!--        <el-table-column prop="created_at" label="创建时间" align="center"/>-->
         <!--        <el-table-column prop="updated_at" label="更新时间" align="center"/>-->
-        <el-table-column :label="T('Actions')" align="center" width="400">
+        <el-table-column :label="T('Actions')" align="center" width="500">
           <template #default="{row}">
-            <el-button type="success" @click="toWebClientLink(row)">Web-Client</el-button>
+            <el-button type="success" @click="toWebClientLink(row)">Web Client</el-button>
+            <el-button type="primary" @click="toShowShare(row)">{{ T('ShareByWebClient') }}</el-button>
             <el-button @click="toEdit(row)">{{ T('Edit') }}</el-button>
             <el-button type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
           </template>
@@ -114,6 +115,12 @@
         </el-form-item>
       </el-form>
     </el-dialog>
+    <el-dialog v-model="shareToWebClientVisible" width="900" :close-on-click-modal="false">
+      <shareByWebClient :id="shareToWebClientForm.id"
+                        :hash="shareToWebClientForm.hash"
+                        @cancel="shareToWebClientVisible=false"
+                        @success=""/>
+    </el-dialog>
   </div>
 </template>
 
@@ -123,6 +130,7 @@
   import { useRepositories } from '@/views/address_book'
   import { toWebClientLink } from '@/utils/webclient'
   import { T } from '@/utils/i18n'
+  import shareByWebClient from '@/views/address_book/components/shareByWebClient.vue'
 
   const tagList = ref([])
   const fetchTagListData = async () => {
@@ -145,6 +153,9 @@
     toEdit,
     toAdd,
     submit,
+    shareToWebClientVisible,
+    shareToWebClientForm,
+    toShowShare,
   } = useRepositories()
 
   listQuery.is_my = 1