<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" ">
<title id="needhtml5">创知厚德知产在线</title>
<link rel="stylesheet" href="/css/ele/chalk.css">
<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="/css/fontawesome/css/font-awesome.min.css">
<link rel="stylesheet" href="/css/autocomplete.css">
<script src="/js/vue/vue.min.js"></script>
<script src="/js/ele/index.js"></script>

<style>

</style>
</head>
<body style="overflow: auto;">
  <div id="app" style="background-color:#FFFFFF;visibility:hidden;">
		<div style="height:40px;background-color:#202326">
	  	<div style="width:100%;margin:0 auto;">
				<div style="color:white;padding:7px 20px;font-size:16px;font-weight:bold;float:left">创知厚德知产在线</div>
				<div style="float:left;">
					<el-button type="text" style="color:white;font-size:14px;cursor:pointer;font-family:Microsoft YaHei" @click="firstPage">首页</el-button>
					<el-dropdown @command="handleCommand" v-if="hastop">
						<span class="el-button--text">
							个人中心<i class="el-icon-arrow-down el-icon--right"></i>
						</span>
						<el-dropdown-menu slot="dropdown">
							<el-dropdown-item command="order">我的订单</el-dropdown-item>
							<el-dropdown-item command="tm">我的商标</el-dropdown-item>
							<el-dropdown-item command="mySoftwarecrsubmit">我的软件版权</el-dropdown-item>
							<el-dropdown-item command="myWorkcrsubmit">我的作品版权</el-dropdown-item>
						</el-dropdown-menu>
					</el-dropdown>
			  </div>
	  </div>
		<div style="clear:both"></div>

		<!-- 轮播图设置 -->
		<div style="width:100%;height:490px;margin:0 auto;">
			<el-carousel height="490px" >
	      <el-carousel-item v-for="item in scrollpicture" :key="item">
	        <img style="width:1920px;height:490px;" :src="item.url" />
	      </el-carousel-item>
	    </el-carousel>
		</div>

		<div style="width:100%;background-color:#FFFFFF" >
			<div style="width:1200px;margin:0 auto;">
				<div id="itemTypeName" v-for="item in datalist" @click="change(item.itemType)" :style="styleset(item.itemType)" style="cursor: pointer;float:left;margin-top:20px;text-align:center;font-size:24px;font-weight:600;margin-bottom:20px;font-family:Microsoft YaHei">
					{{item.itemTypeName}}服务
				</div>
				<div style="clear:both"></div>
			</div>

      <!-- 小类及对应产品设置 -->
      <div v-for="item in datalist" style="width:100%;background-color:#F5F5F5;">
				<div v-if="item.itemType==itemtype" style="width:1200px;margin:0 auto" >
					<div v-for="it in item.smallList" style="width:1200px;padding-top:20px;padding-bottom:20px">
            <div style="width:1200px">
							<div style="background-color:#2692FF;height:24px;width:4px;float:left"></div>
							<div style="margin-left:10px;font-size:20px;font-weight:600;color:#2F2F2F;float:left;font-family:Microsoft YaHei">{{it.serviceSmallClassTypeName}}</div>
						</div>
						<div style="clear:both"></div>
						<el-card  v-for="i in it.productList" style="width:391px;height:400px;float:left;margin:30px 3px">
							<div style="width:140px;height:120px;margin:0 auto">
								<img :src="i.mobilePic" style="width:100%;height:100%"></img>
							</div>
							<div style="width:80%;margin-left:10%;text-align:center;font-size:24px;margin-top:10px;color:#2F2F2F;font-weight:400;font-family:Microsoft YaHei">{{i.name}}</div>
							<div style="width:80%;height:80px;margin-left:10%;color:#828282;font-size:16px;font-weight:400px;margin-top:12px;font-family:Microsoft YaHei">{{i.shortDesc}}</div>
              <div style="width:80%;margin-left:10%;text-align:center;font-size:18px;font-weight:600;color:#FF394D;font-family:PingFangSC-Regular;margin-bottom:20px;font-family:Microsoft YaHei">¥{{i.guidePrice}}/件</div>
							<div style="width:80%;margin-left:10%;text-align:center">
								<!-- <el-button type="primary" style="border-radius:2px;width:160px;font-family:Microsoft YaHei" @click="showneed(i.name,i.code)">立即咨询</el-button> -->
								<el-button type="primary" style="border-radius:2px;width:160px;font-family:Microsoft YaHei" @click="showneed(i.name,i.code)">{{i.name=='自助商标注册'||i.name=='软件著作权登记'||i.name == '美术作品版权登记' || i.name == '文字作品版权登记'?'立即办理':'立即咨询'}}</el-button>
					
							</div>
						</el-card>


          <div style="clear:both"></div>
					</div>
				</div>
			</div>

		</div>


	  <div  style="clear:both"></div>
		<div style="width:100%;background-color:#202326;height:200px;">
			<div style="width:1200px;margin:0 auto;height:160px;padding-top:40px">
        <div style="width:1200px;text-align:left;color:#FFFFFF;font-size:16px;font-weight:400;font-family:Microsoft YaHei">特约知识产权服务提供商：创知厚德（北京）科技有限公司</div>
				<div style="width:1200px;margin-top:20px">
					<div style="float:left;font-size:14px;font-weight:400;color:#B2B2B2;font-family:Microsoft YaHei">客服电话：4006-798-9999</div>
					<div style="float:left;margin-left:30px;font-size:14px;font-weight:400;color:#B2B2B2;font-family:Microsoft YaHei">邮箱：czhd_ip@gongsibao.com</div>
				</div>
				<div style="clear:both"></div>
			  <div style="width:1200px;text-align:left;color:#B2B2B2;font-size:14px;font-weight:400;margin-top:20px;font-family:Microsoft YaHei">地址：北京市朝阳区朝来高科技产业园10号楼102号</div>
			</div>
		</div>


		<el-dialog title="提交需求" :visible.sync="dialogFormVisible" center width="600px" >
			<el-form :model="form" ref="form" :rules="rules" style="margin-left:40px">
				<div style="color:#606266;font-size:14px;font-weight:400;line-height:12px;margin-bottom:30px;margin-left:12px">服务需求：{{serviceName}}</div>
				<el-form-item label="您的名字：" prop="name">
          <el-input v-model="form.name" autocomplete="off" placeholder="请输入您的名字" style="width:360px"></el-input>
        </el-form-item>
				<el-form-item label="联系方式：" prop="mobile">
          <el-input v-model="form.mobile" autocomplete="off" placeholder="请输入您的电话" style="width:360px"></el-input>
        </el-form-item>
				<el-form-item label="所属城市：" prop="city" >
					<el-cascader style="width:360px"
						expand-trigger="hover"
						:options="bigtype"
						v-model="form.city" placeholder="请选择所属城市">
					</el-cascader>
        </el-form-item>
				<el-form-item label="需求详情：" prop="notes" style="margin-left:12px">
          <el-input v-model="form.notes" type="textarea" :rows="3" autocomplete="off" placeholder="请输入您的详细内容" style="width:360px"></el-input>
        </el-form-item>
				<el-form-item >
					<div style="width:100%;font-size:12px;color:#B2B2B2;margin-left:12px;font-family:Microsoft YaHei">
						<i class="el-icon-info"></i>
						提交需求后，我们专业代理人会及时与您联系，为您服务，请保持电话畅通。
				  </div>
				</el-form-item >
				<el-form-item >
					<div style="width:100%;text-align:center;font-family:Microsoft YaHei">
						<el-button type="primary" @click="submitneed">提交</el-button>
		        <el-button @click="dialogFormVisible=false">取消</el-button>
					</div>
	      </el-form-item>
			</el-form>
		</el-dialog>

  </div>
	<script src="/js/vue/jquery.min.js"></script>
  <script src="/js/vue/axios.min.js"></script>
  <script src="/js/autosubmithtml5s.js"></script>
</body>
</html>
