From 02dd7d431d0a414bafef4602350d24c72a41de3f Mon Sep 17 00:00:00 2001 From: su1124 <1583764726@qq.com> Date: 星期一, 08 一月 2024 18:03:40 +0800 Subject: [PATCH] su --- src/views/picture/music/index.vue | 1712 ++++++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 1,283 insertions(+), 429 deletions(-) diff --git a/src/views/picture/music/index.vue b/src/views/picture/music/index.vue index fdee51f..ac58e26 100644 --- a/src/views/picture/music/index.vue +++ b/src/views/picture/music/index.vue @@ -1,104 +1,114 @@ <template> - <div class="app-container"> - <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> - <el-form-item label="浣撴鍙�" prop="tjNum"> - <el-input v-model="queryParams.tjNum" placeholder="璇疯緭鍏ヤ綋妫�鍙�" clearable @keyup.enter.native="handleQuery" - style="width: 160px;" /> - </el-form-item> - <el-form-item label="濮撳悕" prop="name"> - <el-input v-model="queryParams.name" placeholder="璇疯緭鍏ュ鍚�" clearable @keyup.enter.native="handleQuery" - style="width: 110px;" /> - </el-form-item> - <!-- <el-form-item label="椤圭洰" prop="proId"> - <el-input - v-model="queryParams.proId" - placeholder="璇疯緭鍏ラ」鐩�" - clearable - @keyup.enter.native="handleQuery" - /> - </el-form-item> --> - <!-- <el-form-item label="椤圭洰鍚�" prop="proName"> - <el-input - v-model="queryParams.proName" - placeholder="璇疯緭鍏ラ」鐩悕" - clearable - @keyup.enter.native="handleQuery" - style="width: 150px;" - /> - </el-form-item> --> - <!-- <el-form-item label="椤圭洰缁撴灉" prop="proResult"> - <el-input - v-model="queryParams.proResult" - placeholder="璇疯緭鍏ラ」鐩粨鏋�" - clearable - @keyup.enter.native="handleQuery" - /> - </el-form-item> - <el-form-item label="缁撹" prop="conclusion"> - <el-input - v-model="queryParams.conclusion" - placeholder="璇疯緭鍏ョ粨璁�" - clearable - @keyup.enter.native="handleQuery" - /> - </el-form-item> --> - <el-form-item> - <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">鎼滅储</el-button> - <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">閲嶇疆</el-button> - </el-form-item> - </el-form> + <div class="app-container"> + <el-form + :model="queryParams" + ref="queryForm" + size="small" + :inline="true" + v-show="showSearch" + label-width="68px" + > + <el-form-item label="浣撴鍙�" prop="tjNum"> + <el-input + ref="inputName" + v-model="queryParams.tjNum" + placeholder="璇疯緭鍏ヤ綋妫�鍙�" + clearable + @keyup.enter.native="handleQuery" + @blur="handleQuery" + style="width: 160px" + /> + </el-form-item> + <el-form-item label="濮撳悕" prop="name"> + <el-input + v-model="queryParams.name" + placeholder="璇疯緭鍏ュ鍚�" + clearable + @keyup.enter.native="handleQuery" + style="width: 110px" + /> + </el-form-item> + <!-- <el-form-item label="椤圭洰" prop="proId"> + <el-input v-model="queryParams.proId" placeholder="璇疯緭鍏ラ」鐩�" clearable @keyup.enter.native="handleQuery"/></el-form-item> --> + <!-- <el-form-item label="椤圭洰鍚�" prop="proName"> + <el-input v-model="queryParams.proName" placeholder="璇疯緭鍏ラ」鐩悕" clearable @keyup.enter.native="handleQuery" style="width: 150px;"/></el-form-item> --> + <!-- <el-form-item label="椤圭洰缁撴灉" prop="proResult"> + <el-input v-model="queryParams.proResult" placeholder="璇疯緭鍏ラ」鐩粨鏋�" clearable @keyup.enter.native="handleQuery"/></el-form-item> + <el-form-item label="缁撹" prop="conclusion"> + <el-input v-model="queryParams.conclusion" placeholder="璇疯緭鍏ョ粨璁�" clearable @keyup.enter.native="handleQuery"/></el-form-item> --> + <el-form-item> + <el-button + type="primary" + icon="el-icon-search" + size="mini" + @click="handleQuery" + >鎼滅储</el-button + > + <el-button icon="el-icon-refresh" size="mini" @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="el-icon-plus" size="mini" @click="handleAdd" - v-hasPermi="['picture:picture:add']">鏂板 - </el-button> - </el-col> - <el-col :span="1.5"> - <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" - v-hasPermi="['picture:picture:edit']">淇敼 - </el-button> - </el-col> - <el-col :span="1.5"> - <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" - v-hasPermi="['picture:picture:remove']">鍒犻櫎 - </el-button> - </el-col> - <el-col :span="1.5"> - <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" - v-hasPermi="['picture:picture:export']">瀵煎嚭 - </el-button> - </el-col> - <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> - </el-row> --> - <div style="width: 100%; margin-left: 10px;display: flex;"> - <div style="width: 39%; margin-right: 30px;"> - <el-table id="table" v-loading="loading" ref="tb" :data="pictureList" - @selection-change="handleSelectionChange" border height="630px"> - <el-table-column type="selection" width="40" align="center" /> - <el-table-column label="浣撴鍙�" align="center" prop="customer.tjNumber" width="160px" /> - <el-table-column label="濮撳悕" align="center" prop="customer.cusName" width="90px" /> - <!-- <el-table-column label="韬唤璇�" align="center" prop="customer.cusIdcard" width="170px" /> --> - <el-table-column label="鎬у埆" align="center" prop="customer.cusSex" width="60px"> - <template slot-scope="scope"> - {{ scope.row.customer.cusSex === 0 ? "鐢�" : "濂�" }} - <!-- <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.cusSex " /> --> - </template> - </el-table-column> - <!-- <el-table-column label="鐢熸棩" align="center" prop="customer.cusBrithday" width="110px" /> --> - <el-table-column label="鎵嬫満鍙�" align="center" prop="customer.cusPhone" width="120px" /> - <el-table-column label="濠氬Щ" align="center" prop="cusMarryStatus" width="90px"> - <template slot-scope="scope"> - <dict-tag :options="dict.type.dict_user_marry" :value="scope.row.customer.cusMarryStatus" /> - </template> - </el-table-column> - <el-table-column label="姘戞棌" align="center" prop="cusNational" width="90px"> - <template slot-scope="scope"> - <dict-tag :options="dict.type.dict_user_national" :value="scope.row.customer.cusNational" /> - </template> - </el-table-column> - <!-- <el-table-column label="蹇冪數鍥�" align="center" prop="xdt" /> --> - <!-- <el-table-column label="椤圭洰鍚�" align="center" prop="proName" /> + <div style="width: 100%; margin-left: 10px; display: flex"> + <div style="width: 97%; margin-right: 30px"> + <!-- @selection-change="handleSelectionChange" --> + <el-table + id="table" + v-loading="loading" + ref="tb" + :data="pictureList" + @row-click="handleRowClick" + border + height="630px" + > + <!-- <el-table-column type="selection" width="40" align="center" /> --> + <el-table-column + label="浣撴鍙�" + align="center" + prop="customer.tjNumber" + /> + <el-table-column + label="濮撳悕" + align="center" + prop="customer.cusName" + /> + <!-- <el-table-column label="韬唤璇�" align="center" prop="customer.cusIdcard" width="170px" /> --> + <el-table-column label="鎬у埆" align="center" prop="customer.cusSex"> + <!-- <template slot-scope="scope"> + {{ scope.row.customer.cusSex === 0 ? "鐢�" : "濂�" }} + </template> --> + <template slot-scope="scope"> + <dict-tag + :options="dict.type.sys_user_sex" + :value="scope.row.customer.cusSex" + /> + </template> + </el-table-column> + <!-- <el-table-column label="鐢熸棩" align="center" prop="customer.cusBrithday" width="110px" /> --> + <el-table-column + label="鎵嬫満鍙�" + align="center" + prop="customer.cusPhone" + /> + <el-table-column label="濠氬Щ" align="center" prop="cusMarryStatus"> + <template slot-scope="scope"> + <dict-tag + :options="dict.type.dict_user_marry" + :value="scope.row.customer.cusMarryStatus" + /> + </template> + </el-table-column> + <el-table-column label="姘戞棌" align="center" prop="cusNational"> + <template slot-scope="scope"> + <dict-tag + :options="dict.type.dict_user_national" + :value="scope.row.customer.cusNational" + /> + </template> + </el-table-column> + <!-- <el-table-column label="蹇冪數鍥�" align="center" prop="xdt" /> --> + <!-- <el-table-column label="椤圭洰鍚�" align="center" prop="proName" /> <el-table-column label="椤圭洰缁撴灉" align="center" prop="proResult" /> <el-table-column label="缁撹" align="center" prop="conclusion" /> <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width"> @@ -121,29 +131,39 @@ </el-button> </template> </el-table-column> --> - </el-table> - </div> - <div style="width: 44%;height: 610px;"> - <el-table v-loading="loading" ref="mu" :data="tableList" @selection-change="handleChange" border> - <el-table-column type="selection" width="40" align="center" /> - <el-table-column label="鏀惰垂椤圭洰" align="center" prop="proName" /> - <el-table-column label="椤圭洰鍚嶇О" align="center" prop="proName" /> - <el-table-column label="椤圭洰缁撴灉" align="center" prop="fixedValue" /> - <!-- <el-table-column label="缁撹" align="center" prop="measuredValue" /> --> - </el-table> - - <div style=" height:390px;margin-top: 10px;"> - <el-image v-loading="loading" style='height: 390px;width: 100%;' :src="imgsrc + tjNumber + '.png'" - :preview-src-list="[imgsrc + tjNumber + '.png']"></el-image> - </div> - <!-- <div style=" height:390px;margin-top: 10px;"> + </el-table> + </div> + <!-- <div style="width: 44%; height: 610px"> + <el-table + v-loading="loading" + ref="mu" + :data="tableList" + @selection-change="handleChange" + border + > + <el-table-column type="selection" width="40" align="center" /> + <el-table-column label="鏀惰垂椤圭洰" align="center" prop="proName" /> + <el-table-column label="椤圭洰鍚嶇О" align="center" prop="proName" /> + <el-table-column label="椤圭洰缁撴灉" align="center" prop="fixedValue" /> --> + <!-- <el-table-column label="缁撹" align="center" prop="measuredValue" /> --> + <!-- </el-table> + + <div style="height: 390px; margin-top: 10px"> + <el-image + v-loading="loading" + style="height: 390px; width: 100%" + :src="imgsrc + tjNumber + '.png'" + :preview-src-list="[imgsrc + tjNumber + '.png']" + ></el-image> + </div> --> + <!-- <div style=" height:390px;margin-top: 10px;"> <div class="left"> --> - <!-- style='height: 390px;width: 100%;' --> - <!-- <el-image v-loading="loading" class="leftImg" :src="imgsrc"></el-image> --> - <!-- 榧犳爣灞傜僵 --> - <!-- <div v-show="topShow" class="top" :style="topStyle"></div> --> - <!-- 鏈�椤跺眰瑕嗙洊浜嗘暣涓師鍥剧┖闂寸殑閫忔槑灞傜僵 --> - <!-- <div class="maskTop" @mouseenter="enterHandler" @mousemove="moveHandler" @mouseout="outHandler"> + <!-- style='height: 390px;width: 100%;' --> + <!-- <el-image v-loading="loading" class="leftImg" :src="imgsrc"></el-image> --> + <!-- 榧犳爣灞傜僵 --> + <!-- <div v-show="topShow" class="top" :style="topStyle"></div> --> + <!-- 鏈�椤跺眰瑕嗙洊浜嗘暣涓師鍥剧┖闂寸殑閫忔槑灞傜僵 --> + <!-- <div class="maskTop" @mouseenter="enterHandler" @mousemove="moveHandler" @mouseout="outHandler"> </div> </div> <div v-show="rShow" class="right"> @@ -151,24 +171,37 @@ </div> </div> --> + <!-- <div style="margin-top: 20px"> + <el-form + :model="form" + ref="queryForm" + size="small" + :inline="true" + label-width="68px" + > + <el-form-item label="椤圭洰缁撴灉" prop="fixedValue"> + <el-input v-model="form.fixedValue" clearable /> + </el-form-item> + <el-form-item label="缁撴灉缁撹" prop="measuredValue"> + <el-input + v-model="form.measuredValue" + clearable + @focus="submiepilog" + /> + </el-form-item> + <el-form-item> + <el-button + type="primary" + icon="el-icon-search" + size="mini" + @click="submito" + >鎻愪氦</el-button + > + </el-form-item> + </el-form> + </div> --> - - <div style="margin-top: 20px;"> - <el-form :model="form" ref="queryForm" size="small" :inline="true" label-width="68px"> - <el-form-item label="椤圭洰缁撴灉" prop="fixedValue"> - <el-input v-model="form.fixedValue" clearable /> - </el-form-item> - <el-form-item label="缁撴灉缁撹" prop="measuredValue"> - <el-input v-model="form.measuredValue" clearable @focus="submiepilog" /> - </el-form-item> - <el-form-item> - <el-button type="primary" icon="el-icon-search" size="mini" @click="submito">鎻愪氦</el-button> - </el-form-item> - </el-form> - </div> - - - <!-- <div style="display:flex"> + <!-- <div style="display:flex"> <el-tabs v-model="activeName" type="card" style="margin: 10px;width: 100%;"> <el-tab-pane label="椤圭洰缁撴灉" name="first"> <el-input type="textarea" :rows="3" placeholder="璇疯緭鍏ュ唴瀹�" @@ -185,342 +218,1163 @@ <el-button type="primary" icon="el-icon-s-claim" size="mini" @click="submito">鎻愪氦</el-button> </div> </div> --> - </div> - </div> - - - <div style="margin-right: 70%;"> - <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" - :limit.sync="queryParams.pageSize" @pagination="getList" /> - </div> - - <Public ref="aaa" @add="handleChanges" /> + <!-- </div> --> </div> -</template> + <div style="margin-right: 70%"> + <pagination + v-show="total > 0" + :total="total" + :page.sync="queryParams.pageNum" + :limit.sync="queryParams.pageSize" + @pagination="getList" + /> + </div> + <el-drawer + title="鎴戞槸鏍囬" + :visible.sync="drawer" + :with-header="false" + size="85%" + > + <div class="tanchuangbox"> + <div class="tanchuangbox_left"> + <el-form + :model="row" + ref="queryForm" + size="small" + :inline="true" + label-width="68px" + > + <el-form-item label="鍗曚綅鍚嶇О" prop="tjNum"> + <el-input + v-model="queryParams.tjNum" + placeholder="璇疯緭鍏ュ崟浣嶅悕绉�" + style="width: 150px" + disabled + /> + </el-form-item> + <el-form-item label="鍗曚綅宸ョ" prop="name"> + <el-input + v-model="queryParams.name" + placeholder="璇疯緭鍏ュ崟浣嶅伐绉�" + disabled + style="width: 150px" + /> + </el-form-item> + <el-form-item label="濮撳悕" prop="cusName"> + <el-input + v-model="row.cusName" + placeholder="璇疯緭鍏ュ鍚�" + disabled + style="width: 150px" + /> + </el-form-item> + <el-form-item label="鎬у埆" prop="cusSex"> + <el-select + disabled + v-model="row.cusSex" + placeholder="璇烽�夋嫨鎬у埆" + style="width: 150px" + > + <el-option + v-for="dict in dict.type.sys_user_sex" + :key="dict.value" + :label="dict.label" + :value="parseInt(dict.value)" + ></el-option> + </el-select> + </el-form-item> + <el-form-item label="骞撮緞" prop="age"> + <el-input + v-model="row.age" + placeholder="璇疯緭鍏ュ勾榫�" + disabled + style="width: 150px" + /> + </el-form-item> + <el-form-item label="韬唤璇佸彿" prop="cusIdcard"> + <el-input + v-model="row.cusIdcard" + placeholder="璇疯緭鍏ヨ韩浠借瘉鍙�" + disabled + style="width: 150px" + /> + </el-form-item> + <el-form-item label="浣撴鏃ユ湡" prop="tjTime"> + <el-input + v-model="row.tjTime" + placeholder="璇疯緭鍏ヤ綋妫�鏃ユ湡" + disabled + style="width: 150px" + /> + </el-form-item> + <el-form-item label="浣撴绫诲瀷" prop="tjType"> + <el-select + disabled + v-model="row.tjType" + placeholder="璇烽�夋嫨浣撴绫诲瀷" + style="width: 150px" + > + <el-option + v-for="dict in dict.type.dict_tjtype" + :key="dict.value" + :label="dict.label" + :value="parseInt(dict.value)" + /> + </el-select> + </el-form-item> + <!-- <el-form-item label="宸ラ緞" prop="name"> + <el-input + v-model="queryParams.name" + placeholder="璇疯緭鍏ュ伐榫�" + disabled + style="width: 150px" + /> + </el-form-item> --> + </el-form> + <div class="data-view"> + <div id="main" style="width: 40%; height: 300px"></div> + <div id="main1" style="width: 40%; height: 300px"></div> + <div id="main2" style="width: 40%; height: 300px"></div> + <div id="main3" style="width: 40%; height: 300px"></div> + </div> + <div class="tanchuangbox_left1"> + <div> + <div class="nums"> + <span + class="nums_txt" + v-for="(item, index) in yList" + :key="index" + >{{ item }}</span + > + </div> + <el-form + :model="queryParams" + ref="queryForm" + size="small" + :inline="true" + v-show="showSearch" + label-width="90px" + > + <el-form-item label="瀹炴祴姘斿鍊�:"> + <el-input + v-model="yqdwb" + style="width: 50px" + @input="ysels" + /> + <el-input + v-model="yqdyq" + style="width: 50px" + @input="ysels1" + /> + <el-input + v-model="yqdlq" + style="width: 50px" + @input="ysels2" + /> + <el-input + v-model="yqdsq" + style="width: 50px" + @input="ysels3" + /> + <el-input + v-model="yqdsiq" + style="width: 50px" + @input="ysels4" + /> + <el-input + v-model="yqdliuq" + style="width: 50px" + @input="ysels5" + /> + </el-form-item> + <el-form-item label="瀹炴祴楠ㄥ鍊�:"> + <el-input + v-model="ygdwb" + style="width: 50px" + @input="ygsels" + /> + <el-input + v-model="ygdyq" + style="width: 50px" + @input="ygsels1" + /> + <el-input + v-model="ygdlq" + style="width: 50px" + @input="ygsels2" + /> + <el-input + v-model="ygdsq" + style="width: 50px" + @input="ygsels3" + /> + <el-input + v-model="ygdsiq" + style="width: 50px" + @input="ygsels4" + /> + <el-input + v-model="ygdliuq" + style="width: 50px" + @input="ygsels5" + /> + </el-form-item> + </el-form> + </div> + + <div> + <div class="nums"> + <span + class="nums_txt" + v-for="(item, index) in yList" + :key="index" + >{{ item }}</span + > + </div> + <el-form + :model="queryParams" + ref="queryForm" + size="small" + :inline="true" + v-show="showSearch" + label-width="90px" + > + <el-form-item label="瀹炴祴姘斿鍊�:"> + <el-input + v-model="zqdwb" + style="width: 50px" + @input="zsels" + /> + <el-input + v-model="zqdyq" + style="width: 50px" + @input="zsels1" + /> + <el-input + v-model="zqdlq" + style="width: 50px" + @input="zsels2" + /> + <el-input + v-model="zqdsq" + style="width: 50px" + @input="zsels3" + /> + <el-input + v-model="zqdsiq" + style="width: 50px" + @input="zsels4" + /> + <el-input + v-model="zqdliuq" + style="width: 50px" + @input="zsels5" + /> + </el-form-item> + <el-form-item label="瀹炴祴楠ㄥ鍊�:"> + <el-input + v-model="zgdwb" + style="width: 50px" + @input="zgsels" + /> + <el-input + v-model="zgdyq" + style="width: 50px" + @input="zgsels1" + /> + <el-input + v-model="zgdlq" + style="width: 50px" + @input="zgsels2" + /> + <el-input + v-model="zgdsq" + style="width: 50px" + @input="zgsels3" + /> + <el-input + v-model="zgdsiq" + style="width: 50px" + @input="zgsels4" + /> + <el-input + v-model="zgdliuq" + style="width: 50px" + @input="zgsels5" + /> + </el-form-item> + </el-form> + </div> + </div> + </div> + <div class="tanchuangbox_right"> + <div> + <span>鑱屼笟鍙�</span> + <div style="width: 100%; min-height: 300px"></div> + </div> + <div style="display: flex; margin-top: 20px"> + <div + style=" + width: 50px; + display: flex; + flex-direction: column; + margin-top: 46px; + " + > + <span style="margin-bottom: 16px">鍙宠�筹細</span> + <span style="margin-bottom: 17px">宸﹁�筹細</span> + <span>鍙岃�筹細</span> + </div> + <div class="ss"> + <span class="ss_txt">璇骞冲潎</span> + <el-input v-model="input" style="width: 60px"></el-input> + <el-input v-model="input" style="width: 60px"></el-input> + <el-input v-model="input" style="width: 60px"></el-input> + </div> + <div class="ss"> + <span class="ss_txt">500璇鐭</span> + <el-input v-model="input" style="width: 60px"></el-input> + <el-input v-model="input" style="width: 60px"></el-input> + </div> + <div class="ss"> + <span class="ss_txt">1000璇鐭</span> + <el-input v-model="input" style="width: 60px"></el-input> + <el-input v-model="input" style="width: 60px"></el-input> + </div> + <div class="ss"> + <span class="ss_txt">2000璇鐭</span> + <el-input v-model="input" style="width: 60px"></el-input> + <el-input v-model="input" style="width: 60px"></el-input> + </div> + <div class="ss"> + <span class="ss_txt">楂橀姘斿骞冲潎</span> + <el-input v-model="input" style="width: 60px"></el-input> + <el-input v-model="input" style="width: 60px"></el-input> + <el-input v-model="input" style="width: 60px"></el-input> + </div> + <div class="ss"> + <span class="ss_txt">楂橀楠ㄥ骞冲潎</span> + <el-input v-model="input" style="width: 60px"></el-input> + <el-input v-model="input" style="width: 60px"></el-input> + </div> + </div> + + <div style="margin-top: 20px"> + <span>鐢垫祴鍚皬缁擄細</span> + <el-input + style="margin-top: 10px" + type="textarea" + :rows="2" + placeholder="璇疯緭鍏ュ唴瀹�" + v-model="textarea" + > + </el-input> + </div> + <div> + <span>甯歌璧锋鍒楄〃</span> + <el-table :data="tableData" style="width: 100%"> + <el-table-column prop="date" label="搴忓彿" width="180"> + </el-table-column> + <el-table-column prop="name" label="鎵�瑙侀」绫诲瀷" width="180"> + </el-table-column> + <el-table-column prop="address" label="鎵�瑙侀」缁撴灉鍊�"> + </el-table-column> + </el-table> + </div> + <div style="margin-top: 20px"> + <span>妫�鏌ュ尰鐢燂細</span> + <el-input + v-model="input" + style="width: 160px; margin-right: 10px" + ></el-input> + <el-date-picker v-model="value1" type="date" placeholder="閫夋嫨鏃ユ湡"> + </el-date-picker> + </div> + <div style="margin-top: 20px"> + <el-button type="primary">鐢熸垚灏忕粨</el-button> + <el-button type="primary">淇濆瓨</el-button> + </div> + </div> + </div> + </el-drawer> + + <Public ref="aaa" @add="handleChanges" /> + </div> +</template> + <script> import { - getList, - getPicture, - delPicture, - addPicture, - updatePureToneTest + getList, + getPicture, + delPicture, + addPicture, + updatePureToneTest, } from "@/api/picture/pureToneTest"; +import { + getCustomer, + getOrder, + getReportToday, + getTobeToday, + getPieChart, + getChart, +} from "@/api/home"; +const echarts = require("echarts/lib/echarts"); +require("echarts/lib/component/title"); +require("echarts/lib/component/tooltip"); +require("echarts/lib/component/legend"); +require("echarts/lib/chart/pie"); import Public from "@/components/public"; export default { - dicts: [ - "sys_user_sex", "sampling_type", "sys_dict_specimen", "dict_user_marry", "dict_user_national" - ], - name: "Picture", - components: { Public }, - data() { - return { - topStyle: { transform: '' }, - r_img: {}, - topShow: false, - rShow: false, - // 閬僵灞� - loading: true, - result: true, - epilog: false, - // 閫変腑鏁扮粍 - ids: [], - activeName: 'first', - textarea2: '', - // 闈炲崟涓鐢� - single: true, - // 闈炲涓鐢� - multiple: true, - // 鏄剧ず鎼滅储鏉′欢 - showSearch: true, - // 鎬绘潯鏁� - total: 0, - // 浣撴蹇冪數鍥剧鐞嗚〃鏍兼暟鎹� - pictureList: [], - tableList: [], - imgsrc: "", - tjNumber: "", - measuredValue: "", - fixedValue: "", - // 寮瑰嚭灞傛爣棰� - title: "", - // 鏄惁鏄剧ず寮瑰嚭灞� - open: false, - // 鏌ヨ鍙傛暟 - queryParams: { - pageNum: 1, - pageSize: 10, - tjNum: null, - name: null, - xdt: null, - proId: null, - proName: null, - proResult: null, - conclusion: null, - }, - // 琛ㄥ崟鍙傛暟 - form: { - measuredValue: "", - fixedValue: "", - }, - dataobj: {}, - // 琛ㄥ崟鏍¢獙 - rules: { - } - }; + dicts: [ + "sys_user_sex", + "sampling_type", + "sys_dict_specimen", + "dict_user_marry", + "dict_user_national", + "dict_tjtype", + ], + name: "Picture", + components: { Public }, + data() { + return { + res: [], + teamYYNums: [], + LineCharts: [], + row: {}, + value1: "", + yList: [500, 1000, 2000, 3000, 4000, 6000], + tableData: [ + { + date: "1", + name: "鍙傝�冨��", + address: "鍙岃�虫甯稿惉鍔涙洸绾挎甯稿弬鑰冨��1", + }, + { + date: "2", + name: "鍙傝�冨��", + address: "鍙岃�虫甯稿惉鍔涙洸绾挎甯稿弬鑰冨��2", + }, + { + date: "3", + name: "寮傚父鍊�", + address: "鍙岃�虫甯稿惉鍔涙洸绾垮紓甯稿��1", + }, + { + date: "4", + name: "寮傚父鍊�", + address: "鍙岃�虫甯稿惉鍔涙洸绾垮紓甯稿��2", + }, + ], + textarea: "", + input: "", + min: "", + max: "", + Order: "", + ReportToday: "", + TobeToday: "", + youeryuanshi: [], + personYYNum: [], + reportNum: [], + youeryuanshi1: [0, 0, 0, 0, 0, 0], //y鍔ㄦ�佹暟鍊� + youerjiaozheng1: [0, 0, 0, 0, 0, 0], //y鍔ㄦ�佹暟鍊� + zuoeryuanshi1: [0, 0, 0, 0, 0, 0], //y鍔ㄦ�佹暟鍊� + zuoerjiaozheng1: [0, 0, 0, 0, 0, 0], //y鍔ㄦ�佹暟鍊� + PieChart: [], + PieChart2: [], + drawer: false, + topStyle: { transform: "" }, + r_img: {}, + topShow: false, + rShow: false, + // 閬僵灞� + loading: true, + result: true, + epilog: false, + // 閫変腑鏁扮粍 + ids: [], + activeName: "first", + textarea2: "", + // 闈炲崟涓鐢� + single: true, + // 闈炲涓鐢� + multiple: true, + // 鏄剧ず鎼滅储鏉′欢 + showSearch: true, + // 鎬绘潯鏁� + total: 0, + // 浣撴蹇冪數鍥剧鐞嗚〃鏍兼暟鎹� + pictureList: [], + tableList: [], + imgsrc: "", + tjNumber: "", + measuredValue: "", + fixedValue: "", + // 寮瑰嚭灞傛爣棰� + title: "", + // 鏄惁鏄剧ず寮瑰嚭灞� + open: false, + // 鏌ヨ鍙傛暟 + queryParams: { + pageNum: 1, + pageSize: 10, + tjNum: null, + name: null, + xdt: null, + proId: null, + proName: null, + proResult: null, + conclusion: null, + }, + // 琛ㄥ崟鍙傛暟 + form: { + measuredValue: "", + fixedValue: "", + }, + dataobj: {}, + // 琛ㄥ崟鏍¢獙 + rules: {}, + yqdwb: "", + yqdyq: "", + yqdlq: "", + yqdsq: "", + yqdsiq: "", + yqdliuq: "", + ygdwb: "", + ygdyq: "", + ygdlq: "", + ygdsq: "", + ygdsiq: "", + ygdliuq: "", + zqdwb: "", + zqdyq: "", + zqdlq: "", + zqdsq: "", + zqdsiq: "", + zqdliuq: "", + zgdwb: "", + zgdyq: "", + zgdlq: "", + zgdsq: "", + zgdsiq: "", + zgdliuq: "", + }; + }, + created() { + this.getList(); + }, + mounted() { + this.$nextTick(() => { + this.$refs.inputName.focus(); + }); + }, + methods: { + ysels(val) { + this.youeryuanshi1[0] = val; + this.getech(); }, - created() { - this.getList(); + ysels1(val) { + this.youeryuanshi1[1] = val; + this.getech(); }, - methods: { - // 榧犳爣杩涘叆鍘熷浘绌洪棿鍑芥暟 - enterHandler() { - // 灞傜僵鍙婃斁澶х┖闂寸殑鏄剧ず - this.topShow = true - this.rShow = true - }, - // 榧犳爣绉诲姩鍑芥暟 - moveHandler(event) { - // 榧犳爣鐨勫潗鏍囦綅缃� - let x = event.offsetX - let y = event.offsetY - // 灞傜僵鐨勫乏涓婅鍧愭爣浣嶇疆锛屽苟瀵瑰叾杩涜闄愬埗锛氭棤娉曡秴鍑哄師鍥惧尯鍩熷乏涓婅 - let topX = (x - 100) < 0 ? 0 : (x - 100) - let topY = (y - 100) < 0 ? 0 : (y - 100) - // 瀵瑰眰缃╀綅缃啀涓�娆¢檺鍒讹紝淇濊瘉灞傜僵鍙兘鍦ㄥ師鍥惧尯鍩熺┖闂村唴 - if (topX > 200) { - topX = 200 - } - if (topY > 200) { - topY = 200 - } - // 閫氳繃 transform 杩涜绉诲姩鎺у埗 - this.topStyle.transform = `translate(${topX}px,${topY}px)` - this.r_img.transform = `translate(-${2 * topX}px,-${2 * topY}px)` - }, - // 榧犳爣绉诲嚭鍑芥暟 - outHandler() { - // 鎺у埗灞傜僵涓庢斁澶х┖闂寸殑闅愯棌 - this.topShow = false - this.rShow = false - }, - /** 鏌ヨ浣撴蹇冪數鍥剧鐞嗗垪琛� */ - getList() { - this.loading = true; - getList(this.queryParams).then(response => { - if (response.data.list) { - this.pictureList = response.data.list; - } else { - this.$message.warning("鏌ユ棤姝や汉"); - } - if (this.pictureList.length != 0) { - this.$nextTick(() => { - this.$refs.tb.toggleRowSelection(this.pictureList[0], true); - }) - } else { - this.$refs.tb.clearSelection(); - } - this.total = response.data.total; - this.loading = false; - }); - this.loading = false; - }, - // 鍙栨秷鎸夐挳 - cancel() { - this.open = false; - this.reset(); - }, - // 琛ㄥ崟閲嶇疆 - reset() { - this.form = { - id: null, - tjNum: null, - cusId: null, - xdt: null, - proId: null, - proName: null, - proResult: null, - conclusion: null, - createBy: null, - createTime: null, - updateBy: null, - updateTime: null, - deleted: null - }; - this.resetForm("form"); - }, - /** 鎼滅储鎸夐挳鎿嶄綔 */ - handleQuery() { - this.queryParams.pageNum = 1; - this.getList(); - }, - /** 閲嶇疆鎸夐挳鎿嶄綔 */ - resetQuery() { - this.resetForm("queryForm"); - this.handleQuery(); - }, - // 澶氶�夋閫変腑鏁版嵁 - handleSelectionChange(selection) { - this.imgsrc = selection[0].picturePath - this.tjNumber = selection[0].customer.tjNumber - this.ids = selection.map(item => item.id) - selection.forEach(element => { - this.tableList = element.list - if (this.tableList.length != 0) { - this.tableList.forEach(item => { - this.form.fixedValue = item.fixedValue - this.form.measuredValue = item.measuredValue - }) - this.$nextTick(() => { - this.$refs.mu.toggleRowSelection(this.tableList[0], true); - }) - } else { - this.$refs.mu.clearSelection(); - } - }); - // this.tableList.forEach(item => { - // this.imgsrc = item.dctt - // }) - if (selection.length > 1) { - let del_row = selection.shift(); - this.$refs.tb.toggleRowSelection(del_row, false); //璁剧疆杩欎竴琛屽彇娑堥�変腑 - } - this.single = selection.length !== 1 - this.multiple = !selection.length - }, - // /** 鏂板鎸夐挳鎿嶄綔 */ - // handleAdd() { - // this.reset(); - // this.open = true; - // this.title = "娣诲姞浣撴蹇冪數鍥剧鐞�"; - // }, - // /** 淇敼鎸夐挳鎿嶄綔 */ - // handleUpdate(row) { - // this.reset(); - // const id = row.id || this.ids - // getPicture(id).then(response => { - // this.form = response.data; - // this.open = true; - // this.title = "淇敼浣撴蹇冪數鍥剧鐞�"; - // }); - // }, - submiepilog() { - this.$refs.aaa.open = true; - let proId = "1633660948860522546" - this.$refs.aaa.getList(proId); - }, - handleChanges(value) { - this.form.measuredValue = value - }, + ysels2(val) { + this.youeryuanshi1[2] = val; + this.getech(); + }, + ysels3(val) { + this.youeryuanshi1[3] = val; + this.getech(); + }, + ysels4(val) { + this.youeryuanshi1[4] = val; + this.getech(); + }, + ysels5(val) { + this.youeryuanshi1[5] = val; + this.getech(); + }, + ygsels(val) { + this.youerjiaozheng1[0] = val; + this.getech1(); + }, + ygsels1(val) { + this.youerjiaozheng1[1] = val; + this.getech1(); + }, + ygsels2(val) { + this.youerjiaozheng1[2] = val; + this.getech1(); + }, + ygsels3(val) { + this.youerjiaozheng1[3] = val; + this.getech1(); + }, + ygsels4(val) { + this.youerjiaozheng1[4] = val; + this.getech1(); + }, + ygsels5(val) { + this.youerjiaozheng1[5] = val; + this.getech1(); + }, - handleChange(selection) { - selection.forEach(element => { - this.dataobj = element - }); + zsels(val) { + this.zuoeryuanshi1[0] = val; + this.getech2(); + }, + zsels1(val) { + this.zuoeryuanshi1[1] = val; + this.getech2(); + }, + zsels2(val) { + this.zuoeryuanshi1[2] = val; + this.getech2(); + }, + zsels3(val) { + this.zuoeryuanshi1[3] = val; + this.getech2(); + }, + zsels4(val) { + this.zuoeryuanshi1[4] = val; + this.getech2(); + }, + zsels5(val) { + this.zuoeryuanshi1[5] = val; + this.getech2(); + }, + zgsels(val) { + this.zuoerjiaozheng1[0] = val; + this.getech3(); + }, + zgsels1(val) { + this.zuoerjiaozheng1[1] = val; + this.getech3(); + }, + zgsels2(val) { + this.zuoerjiaozheng1[2] = val; + this.getech3(); + }, + zgsels3(val) { + this.zuoerjiaozheng1[3] = val; + this.getech3(); + }, + zgsels4(val) { + this.zuoerjiaozheng1[4] = val; + this.getech3(); + }, + zgsels5(val) { + this.zuoerjiaozheng1[5] = val; + this.getech3(); + }, + handleRowClick(selection) { + this.row = selection.customer; + this.row.tjType = Number(selection.customer.tjType); + this.drawer = true; + // this.getech(); + }, + // 鍙宠�冲師濮嬪惉鍔� + getech() { + this.loading = true; + let myChart = this.$echarts.init(document.getElementById("main")); + + myChart.setOption({ + title: { + text: "鍙宠�冲師濮嬪惉鍔�", }, - - // 纭畾鎸夐挳 - submito() { - if (this.dataobj) { - if (this.form.fixedValue) { - this.dataobj.fixedValue = this.form.fixedValue - } - if (this.form.measuredValue) { - this.dataobj.measuredValue = this.form.measuredValue - } - updatePureToneTest(this.dataobj).then(res => { - this.$modal.msgSuccess("鎻愪氦鎴愬姛"); - this.getList() - this.form.fixedValue = "" - this.form.measuredValue = "" - }) - } else { - this.$modal.msgSuccess("閫夋嫨淇敼椤圭洰"); - } - + tooltip: { + trigger: "axis", }, - - //鍒犻櫎鎸夐挳 - handleDelete() { - + grid: { + left: "3%", + right: "4%", + bottom: "3%", + containLabel: true, }, + toolbox: { + feature: { + saveAsImage: {}, + }, + }, + xAxis: { + data: [500, 1000, 2000, 3000, 4000, 6000], + }, + yAxis: { + type: "value", + }, + series: [ + { + data: this.youeryuanshi1, + name: "鍙宠�冲師濮嬪惉鍔�", + type: "line", + symbol: "circle", //鎷愮偣鐨勫舰鐘� + symbolSize: 10, //鎷愮偣澶у皬 + lineStyle: { + color: "#1515FF", + width: 2, + }, - // 瀵煎嚭 - handleExport() { + itemStyle: { + borderWidth: 1, + borderColor: "black", + color: "#fff", + }, + }, + ], + }); + let sizeFun = function () { + myChart.resize(); + }; + window.addEventListener("resize", sizeFun); + this.loading = false; + }, + // 鍙宠�崇煫姝e惉鍔� + getech1() { + this.loading = true; + let myChart2 = this.$echarts.init(document.getElementById("main2")); + + myChart2.setOption({ + title: { + text: "鍙宠�虫牎姝e惉鍔�", + }, + tooltip: { + trigger: "axis", + }, + grid: { + left: "3%", + right: "4%", + bottom: "3%", + containLabel: true, + }, + toolbox: { + feature: { + saveAsImage: {}, + }, + }, + xAxis: { + data: [500, 1000, 2000, 3000, 4000, 6000], + }, + yAxis: { + type: "value", + }, + series: [ + { + data: this.youerjiaozheng1, + name: "鍙宠�虫牎姝e惉鍔�", + type: "line", + symbol: "none", //鎷愮偣鐨勫舰鐘� + symbolSize: 10, //鎷愮偣澶у皬 + lineStyle: { + color: "#1515FF", + width: 2, + }, + + itemStyle: { + borderWidth: 1, + borderColor: "black", + color: "#fff", + }, + }, + ], + }); + let sizeFun = function () { + myChart.resize(); + }; + window.addEventListener("resize", sizeFun); + + this.loading = false; + }, + // 宸﹁�冲師濮嬪惉鍔� + getech2() { + this.loading = true; + let myChart2 = this.$echarts.init(document.getElementById("main1")); + + myChart2.setOption({ + title: { + text: "宸﹁�冲師濮嬪惉鍔�", + }, + tooltip: { + trigger: "axis", + }, + grid: { + left: "3%", + right: "4%", + bottom: "3%", + containLabel: true, + }, + toolbox: { + feature: { + saveAsImage: {}, + }, + }, + xAxis: { + data: [500, 1000, 2000, 3000, 4000, 6000], + }, + yAxis: { + type: "value", + }, + series: [ + { + data: this.zuoeryuanshi1, + name: "宸﹁�冲師濮嬪惉鍔�", + type: "line", + symbol: "triangle", //鎷愮偣鐨勫舰鐘� + symbolSize: 10, //鎷愮偣澶у皬 + lineStyle: { + color: "#1515FF", + width: 2, + }, + + itemStyle: { + borderWidth: 1, + borderColor: "black", + color: "#fff", + }, + }, + ], + }); + let sizeFun = function () { + myChart.resize(); + }; + window.addEventListener("resize", sizeFun); + + this.loading = false; + }, + // 宸﹁�崇煫姝e惉鍔� + getech3() { + this.loading = true; + let myChart2 = this.$echarts.init(document.getElementById("main3")); + + myChart2.setOption({ + title: { + text: "宸﹁�虫牎姝e惉鍔�", + }, + tooltip: { + trigger: "axis", + }, + grid: { + left: "3%", + right: "4%", + bottom: "3%", + containLabel: true, + }, + toolbox: { + feature: { + saveAsImage: {}, + }, + }, + xAxis: { + data: [500, 1000, 2000, 3000, 4000, 6000], + }, + yAxis: { + type: "value", + }, + series: [ + { + data: this.zuoerjiaozheng1, + name: "宸﹁�虫牎姝e惉鍔�", + type: "line", + symbol: "none", //鎷愮偣鐨勫舰鐘� + symbolSize: 10, //鎷愮偣澶у皬 + lineStyle: { + color: "#1515FF", + width: 2, + }, + + itemStyle: { + borderWidth: 1, + borderColor: "black", + color: "#fff", + }, + }, + ], + }); + let sizeFun = function () { + myChart.resize(); + }; + window.addEventListener("resize", sizeFun); + + this.loading = false; + }, + // 榧犳爣杩涘叆鍘熷浘绌洪棿鍑芥暟 + enterHandler() { + // 灞傜僵鍙婃斁澶х┖闂寸殑鏄剧ず + this.topShow = true; + this.rShow = true; + }, + // 榧犳爣绉诲姩鍑芥暟 + moveHandler(event) { + // 榧犳爣鐨勫潗鏍囦綅缃� + let x = event.offsetX; + let y = event.offsetY; + // 灞傜僵鐨勫乏涓婅鍧愭爣浣嶇疆锛屽苟瀵瑰叾杩涜闄愬埗锛氭棤娉曡秴鍑哄師鍥惧尯鍩熷乏涓婅 + let topX = x - 100 < 0 ? 0 : x - 100; + let topY = y - 100 < 0 ? 0 : y - 100; + // 瀵瑰眰缃╀綅缃啀涓�娆¢檺鍒讹紝淇濊瘉灞傜僵鍙兘鍦ㄥ師鍥惧尯鍩熺┖闂村唴 + if (topX > 200) { + topX = 200; + } + if (topY > 200) { + topY = 200; + } + // 閫氳繃 transform 杩涜绉诲姩鎺у埗 + this.topStyle.transform = `translate(${topX}px,${topY}px)`; + this.r_img.transform = `translate(-${2 * topX}px,-${2 * topY}px)`; + }, + // 榧犳爣绉诲嚭鍑芥暟 + outHandler() { + // 鎺у埗灞傜僵涓庢斁澶х┖闂寸殑闅愯棌 + this.topShow = false; + this.rShow = false; + }, + /** 鏌ヨ浣撴蹇冪數鍥剧鐞嗗垪琛� */ + getList() { + this.loading = true; + getList(this.queryParams).then((response) => { + if (response.data.list) { + this.pictureList = response.data.list; + } else { + this.$message.warning("鏌ユ棤姝や汉"); } + if (this.pictureList.length != 0) { + this.$nextTick(() => { + this.$refs.tb.toggleRowSelection(this.pictureList[0], true); + }); + } else { + this.$refs.tb.clearSelection(); + } + this.total = response.data.total; + this.loading = false; + }); + this.loading = false; + }, + // 鍙栨秷鎸夐挳 + cancel() { + this.open = false; + this.reset(); + }, + // 琛ㄥ崟閲嶇疆 + reset() { + this.form = { + id: null, + tjNum: null, + cusId: null, + xdt: null, + proId: null, + proName: null, + proResult: null, + conclusion: null, + createBy: null, + createTime: null, + updateBy: null, + updateTime: null, + deleted: null, + }; + this.resetForm("form"); + }, + /** 鎼滅储鎸夐挳鎿嶄綔 */ + handleQuery() { + this.queryParams.pageNum = 1; + this.getList(); + }, + /** 閲嶇疆鎸夐挳鎿嶄綔 */ + resetQuery() { + this.resetForm("queryForm"); + this.handleQuery(); + }, + // 澶氶�夋閫変腑鏁版嵁 + // handleSelectionChange(selection) { + // this.drawer = true; + // this.imgsrc = selection[0].picturePath; + // this.tjNumber = selection[0].customer.tjNumber; + // this.ids = selection.map((item) => item.id); + // selection.forEach((element) => { + // this.tableList = element.list; + // if (this.tableList.length != 0) { + // this.tableList.forEach((item) => { + // this.form.fixedValue = item.fixedValue; + // this.form.measuredValue = item.measuredValue; + // }); + // this.$nextTick(() => { + // this.$refs.mu.toggleRowSelection(this.tableList[0], true); + // }); + // } else { + // this.$refs.mu.clearSelection(); + // } + // }); + // // this.tableList.forEach(item => { + // // this.imgsrc = item.dctt + // // }) + // if (selection.length > 1) { + // let del_row = selection.shift(); + // this.$refs.tb.toggleRowSelection(del_row, false); //璁剧疆杩欎竴琛屽彇娑堥�変腑 + // } + // this.single = selection.length !== 1; + // this.multiple = !selection.length; + // }, + // /** 鏂板鎸夐挳鎿嶄綔 */ + // handleAdd() { + // this.reset(); + // this.open = true; + // this.title = "娣诲姞浣撴蹇冪數鍥剧鐞�"; + // }, + // /** 淇敼鎸夐挳鎿嶄綔 */ + // handleUpdate(row) { + // this.reset(); + // const id = row.id || this.ids + // getPicture(id).then(response => { + // this.form = response.data; + // this.open = true; + // this.title = "淇敼浣撴蹇冪數鍥剧鐞�"; + // }); + // }, + submiepilog() { + this.$refs.aaa.open = true; + let proId = "1633660948860522546"; + this.$refs.aaa.getList(proId); + }, + handleChanges(value) { + this.form.measuredValue = value; + }, - } -} - ; + handleChange(selection) { + selection.forEach((element) => { + this.dataobj = element; + }); + }, + + // 纭畾鎸夐挳 + submito() { + if (this.dataobj) { + if (this.form.fixedValue) { + this.dataobj.fixedValue = this.form.fixedValue; + } + if (this.form.measuredValue) { + this.dataobj.measuredValue = this.form.measuredValue; + } + updatePureToneTest(this.dataobj).then((res) => { + this.$modal.msgSuccess("鎻愪氦鎴愬姛"); + this.getList(); + this.form.fixedValue = ""; + this.form.measuredValue = ""; + }); + } else { + this.$modal.msgSuccess("閫夋嫨淇敼椤圭洰"); + } + }, + + //鍒犻櫎鎸夐挳 + handleDelete() {}, + + // 瀵煎嚭 + handleExport() {}, + }, +}; </script> - + <style> #table .el-table__header-wrapper .el-checkbox { - display: none; + display: none; } .default-button-style :hover { - width: 80px; - border-bottom: none; + width: 80px; + border-bottom: none; } - .rightImg { - display: inline-block; - width: 740px; - height: 800px; - position: absolute; - top: 0; - left: 0; - /* border: 1px solid red; */ + display: inline-block; + width: 740px; + height: 800px; + position: absolute; + top: 0; + left: 0; + /* border: 1px solid red; */ } /* 鍙宠竟鐨勫尯鍩熷浘鐗囨斁澶х┖闂� */ .right { - margin-left: 412px; - width: 340px; - height: 400px; - border: 1px solid black; - position: relative; - overflow: hidden; + margin-left: 412px; + width: 340px; + height: 400px; + border: 1px solid black; + position: relative; + overflow: hidden; } /* 涓�涓渶楂樺眰灞傜僵 */ .maskTop { - width: 400px; - height: 400px; - position: absolute; - z-index: 1; - top: 0; - left: 0; + width: 400px; + height: 400px; + position: absolute; + z-index: 1; + top: 0; + left: 0; } /* 灞傜僵锛岄�氳繃瀹氫綅灏嗗乏涓婅瀹氫綅鍒�(0,0) */ .top { - width: 200px; - height: 200px; - background-color: lightcoral; - opacity: 0.4; - position: absolute; - top: 0; - left: 0; + width: 200px; + height: 200px; + background-color: lightcoral; + opacity: 0.4; + position: absolute; + top: 0; + left: 0; } /* 鍘熷浘鐨勬樉绀� */ .leftImg { - width: 400px; - height: 400px; - display: inline-block; + width: 400px; + height: 400px; + display: inline-block; } /* 鍘熷浘鐨勫鍣� */ .left { - width: 400px; - height: 400px; - /* border: 1px solid teal; */ - float: left; - position: relative; + width: 400px; + height: 400px; + /* border: 1px solid teal; */ + float: left; + position: relative; } -</style> +.tanchuangbox_left { + margin-top: 20px; + margin-left: 20px; + width: 60%; +} +.data-view { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + margin: 5px 15px; +} +#main { + padding: 10px; +} +.nums { + margin-left: 90px; + margin-bottom: 10px; +} +.nums_txt { + margin-right: 18px; +} +.tanchuangbox_left1 { + display: flex; +} +.tanchuangbox { + display: flex; +} +.tanchuangbox_right { + width: 40%; +} +.ss { + display: flex; + flex-direction: column; + margin-right: 10px; +} +.ss_txt { + width: 60px; +} +</style> \ No newline at end of file -- Gitblit v1.8.0