From e955c98eaba418d7e48fd9ffca96ef536754c676 Mon Sep 17 00:00:00 2001
From: qiuhongwu <Qhw0227@163.com>
Date: Wed, 11 Oct 2023 08:31:31 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=81=E4=B8=9A=E4=B8=AD=E5=BF=83=E4=B8=9A?=
 =?UTF-8?q?=E5=8A=A1=E7=BB=84=E7=BB=87=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 yunxi-ui-admin-vben/.env.development          |   2 +-
 .../src/views/users/configuration/index.vue   |  96 +++++++++-------
 .../src/views/users/newNustomer/index.vue     | 103 ++++++++++++++----
 3 files changed, 141 insertions(+), 60 deletions(-)

diff --git a/yunxi-ui-admin-vben/.env.development b/yunxi-ui-admin-vben/.env.development
index f43a104..1edac45 100644
--- a/yunxi-ui-admin-vben/.env.development
+++ b/yunxi-ui-admin-vben/.env.development
@@ -7,7 +7,7 @@ VITE_PUBLIC_PATH = /
 # 本地开发代理，可以解决跨域及多地址代理
 # 如果接口地址匹配到，则会转发到http://localhost:3000，防止本地出现跨域问题
 # 可以有多个，注意多个不能换行，否则代理将会失效
-VITE_PROXY = [["/dev-api","http://192.168.0.162:8091/admin-api"],["/upload","http://192.168.0.162:8091/admin-api/infra/file/upload"]]
+VITE_PROXY = [["/dev-api","http://192.168.0.234:8091/admin-api"],["/upload","http://192.168.0.234:8091/admin-api/infra/file/upload"]]
 # VITE_PROXY=[["/api","http://vben.xingyuv.com/test"]]
 
 # 是否删除Console.log
diff --git a/yunxi-ui-admin-vben/src/views/users/configuration/index.vue b/yunxi-ui-admin-vben/src/views/users/configuration/index.vue
index 7ef6a5b..0d9f662 100644
--- a/yunxi-ui-admin-vben/src/views/users/configuration/index.vue
+++ b/yunxi-ui-admin-vben/src/views/users/configuration/index.vue
@@ -1,19 +1,27 @@
 <script lang="ts" setup>
-import type { UnwrapRef, VueElement } from 'vue'
-import { onMounted, reactive, ref, watch  } from 'vue'
-import { RedoOutlined, SearchOutlined, UserOutlined } from '@ant-design/icons-vue'
+import type { UnwrapRef, VueElement, nextTick } from 'vue'
+import { createVNode, getCurrentInstance, h, onMounted, reactive, ref, watch } from 'vue'
+import { ExclamationCircleOutlined, RedoOutlined, SearchOutlined, UserOutlined } from '@ant-design/icons-vue'
 import type { FormProps, ItemType, MenuProps, SelectProps, TableColumnsType  } from 'ant-design-vue'
-
 import type { Dayjs } from 'dayjs'
+import { Modal } from 'ant-design-vue'
 
+// 创建this
+// const { proxy }: any = getCurrentInstance
 //当前选中的菜单项 key 数组
 const selectedKeys = ref<string[]>(['1'])
 
 //默认展开
 const navopenKeys = ref<string[]>(['sub1'])
 
+const title = ref<any>({
+  label:'',
+  key: '',
+})
+
+const items: any = reactive<ItemType[]>([
 
-const items: any = reactive<ItemType[]>([])
+])
 function getItem(
   label: VueElement | string,
   key: string,
@@ -70,10 +78,14 @@ async function fetchMenuItems() {
 async function fetchData() {
   try {
     const data = await fetchMenuItems()
+    console.log(data)
+    
     // 使用响应式数据保存获取到的菜单项
     // items变量通过reactive函数创建为响应式数据。在fetchData函数中，使用splice方法来替换items数组的内容，确保新的数据被响应式地更新。这样，当fetchData异步请求完成后，items数组中的数据将被更新为获取到的菜单项数据
     items.splice(0, items.length, ...data.map(item => getItem(item.label, item.key, null, item.children)))
-    // items.value = data.map(item => getItem(item.label, item.key, null, item.children))
+
+    title.value.label = data[0].children[0].label
+    
   }
   catch (error) {
     console.error('Error fetching menu items:', error)
@@ -367,36 +379,41 @@ const dataSource: any = [
   },
 ]
 
-// //被选中时调
-// function myFunction({ item, key, selectedKeys }) {
-//   // 在这里可以使用 item、key 和 selectedKeys
-//   console.log(item)
-//   console.log(key)
-//   console.log(selectedKeys)
-// }
-
-// // 调用函数时传递一个包含 item、key 和 selectedKeys 属性的对象
-// const data = {
-//   item: '仓库名称',
-//   key: 'someKey',
-//   selectedKeys: ['key1', 'key2'],
-// }
-
-// myFunction(data)
+//删除
+const [modal, contextHolder] = Modal.useModal()
+function showDeleteConfirm() {
+  modal.confirm({
+    title: '操作确认',
+    icon: h(ExclamationCircleOutlined),
+    content: '确认删除嘛',
+    okText: '确认',
+    okType: 'danger',
+    cancelText: '取消',
+    onOk() {
+      console.log('OK')
+    },
+    onCancel() {
+      console.log('Cancel')
+    },
+  })
+}
 
 onMounted(() => {
   fetchData()
 })
 
-const handleClick: MenuProps['onClick'] = (e) => {
-  console.log(e)
+const menusubhandleClick: MenuProps['onClick'] = (e) => {
+  // console.log('click', JSON.parse(JSON.stringify(e.item.originItemValue)) )
+  // alert(`当前打开的是${e.key}`)
+  title.value = JSON.parse(JSON.stringify(e.item.originItemValue)) 
   
-  console.log('click', e)
-  alert(`当前打开的是${e.key}`)
+
+
 }
-watch(navopenKeys, (val) => {
-  console.log('navopenKeys', val)
-})
+// watch(navopenKeys, (val) => {
+//   console.log('-----------')
+//   console.log('navopenKeys', val)
+// })
 </script>
 
 <template>
@@ -417,14 +434,14 @@ watch(navopenKeys, (val) => {
           style="width: 256px;height: 900px;"
           mode="inline"
           :items="items"
-          @click="handleClick"
+          @click="menusubhandleClick"
         />
       </div>
       <div class="main"> 
         <div class="designation">
           <p>
             <span>▋</span>
-            {{ `车间名称` }}
+            {{ title.label }}
           </p>
         </div>
         <!-- 表单 -->
@@ -513,6 +530,7 @@ watch(navopenKeys, (val) => {
           <a-col :span="24">
             <a-table
               class="ant-table-striped" :data-source="dataSource" :row-selection="rowSelection"
+              style="width: 1000px;"
               :columns="columns"
               :row-class-name="(_record, index) => (index % 2 === 1 ? 'table-tr-b' : 'table-tr-a')" :scroll="{ x: 1500, y: 500 }"
             >
@@ -636,7 +654,10 @@ watch(navopenKeys, (val) => {
                   </a-row>
                 </template>
                 <template v-else-if="column.key === 'key'">
-                  <div><a>详情</a></div>
+                  <div centered style="color: red;cursor:pointer" @click="showDeleteConfirm">
+                    删除
+                  </div>
+                  <contextHolder />
                 </template>
               </template>
             </a-table>
@@ -650,17 +671,16 @@ watch(navopenKeys, (val) => {
 <style scoped lang="less">
 .card{
   box-sizing: border-box;
-  width: 90%;
+  width: 1800px;
   margin: 0 auto;
- overflow: hidden;
+  overflow: hidden;
   border-radius: 3px;
 
   .mainbody{
     box-sizing: border-box;
     display: flex;
-    width: 100%;
-    height: 1000px;
-
+    width: 1420px;
+   height: 942px; 
 
   .aside{
      margin: 50px 0;
@@ -678,7 +698,7 @@ watch(navopenKeys, (val) => {
        margin: 10px 0 ;
       
         p{
-            width: 110px;
+            width: 120px;
             height: 24px;
             margin-bottom: 15px; 
             font-family: "AlibabaPuHuiTi_3_55_Regular-55 Regular";
diff --git a/yunxi-ui-admin-vben/src/views/users/newNustomer/index.vue b/yunxi-ui-admin-vben/src/views/users/newNustomer/index.vue
index f1278b1..59dcc1f 100644
--- a/yunxi-ui-admin-vben/src/views/users/newNustomer/index.vue
+++ b/yunxi-ui-admin-vben/src/views/users/newNustomer/index.vue
@@ -6,15 +6,9 @@ import type { SelectProps, UploadChangeParam, UploadProps } from 'ant-design-vue
 import type { Rule } from 'ant-design-vue/es/form'
 import type { Dayjs } from 'dayjs'
 
-//结算信息切换
-const values = ref<any>('buyout')
-
-const isVisible =  ref(true)
-// const isVisible2 = ref(false)
-// const toggleBlocks: any = () => {
-//   isVisible.value = !isVisible.value
-//   isVisible2.value = !isVisible2.value
-// } 
+//结算信息切换  //保留
+const wayvalues = ref<number>(1)
+const payvalues = ref<number>(1)
 
 type RangeValue = [Dayjs, Dayjs]
 const dayvalue1 = ref<RangeValue>()
@@ -1546,36 +1540,101 @@ const RabbitStyle = [{
             <a-form
               :model="formState"
               name="basic"
-              :label-col="{ span: 5 }"
+              :label-col="{ span: 2 }"
               :wrapper-col="{ span: 13 }"
-              autocomplete="off"
-              :rules="rules"
-              @finish="onFinish"
-              @finishFailed="onFinishFailed"
             >
               <a-form-item
                 label="合作方式"
                 name="username"
-                :rules="[{ required: true, message: '选择' }]"
               >
-                <a-radio-group v-model:value="values">
-                  <a-radio :value="buyout">
+                <a-radio-group v-model:value="wayvalues">
+                  <!-- 保留 -->
+                  <a-radio class="rabiostyle" :value="1">
                     买断
                   </a-radio>
-                  <a-radio :value="joint">
+                  <a-radio class="rabiostyle" :value="2">
                     联营
                   </a-radio>
                 </a-radio-group>
               </a-form-item>
-              <div v-if="isVisible" class="buyout">
-                123
+              <div v-if="wayvalues === 1" class="buyout">
+                <a-form-item
+                  label="结算方式"
+                  name="username"
+                >
+                  <a-radio-group v-model:value="payvalues">
+                    <a-radio class="rabiostyle" :value="1">
+                      先贷后款
+                    </a-radio>
+                    <a-radio class="rabiostyle" :value="2">
+                      先款后贷
+                    </a-radio>
+                  </a-radio-group>
+                </a-form-item>
               </div>
-              <div v-else class="joint">
+              <div v-if="wayvalues === 2" class="joint">
                 321
               </div>
             </a-form>
           </div>
         </div>
+        <!-- 联系人信息 -->
+        <div class="representativemation">
+          <div class="moduletop">
+            <p>
+              <span>▋</span>
+              联系人信息
+            </p>
+          </div>
+          <div class="mationtable">
+            <a-table :columns="mationtablecolumns" :data-source="mationtabledata">
+              <template #headerCell="{ column }">
+                <template v-if="column.key === 'type'">
+                  <span>
+                    类型
+                  </span>
+                </template>
+              </template>
+
+              <template #bodyCell="{ column, record }">
+                <template v-if="column.key === 'name'">
+                  {{ record.name }}
+                </template>
+                <template v-else-if="column.key === 'identificationphoto'">
+                  <a :href="record.identificationphoto">
+                    查看
+                  </a>
+                </template>
+                <template v-else-if="column.key === 'Idnumber'">
+                  <span>
+                    {{ record.Idnumber }}
+                  </span>
+                </template>
+                <template v-else-if="column.key === 'validity'">
+                  <span>
+                    {{ record.validity }}
+                  </span>
+                </template>
+                <template v-else-if="column.key === 'impower'">
+                  <a :hreflang="record.impower">
+                    查看
+                  </a>
+                </template>
+                <template v-else-if="column.key === 'turnover'">
+                  <span>
+                    {{ record.turnover }}
+                  </span>
+                </template>
+                <template v-else-if="column.key === 'operate'">
+                  <a>
+                    <EditOutlined />
+                    操作
+                  </a>
+                </template>
+              </template>
+            </a-table>
+          </div>
+        </div>
       </a-form>
     </div>
   </a-card>
@@ -1673,6 +1732,8 @@ const RabbitStyle = [{
   .subdivide{
     width: 30%;
   }
+
+  .modaliy{}
 }
    
 }